angular-tour-of-heroes gives 404 for 'api/heroes"

Question

Just started learning angular development. Following official angular doc from angular.io. Everything was working fine step by step till I reach https://angular.io/tutorial/toh-pt6

Added HttpClientInMemoryWebApiModule for mocking remote server, now it's not working.

here is browser console logs:

It's now able to find out 'api/heroes' endpoint. this may be configuration issue with 'HttpClientInMemoryWebApiModule'.

Here is my source code: https://github.com/csankhala/angular-tour-of-heroes

Please let me know what I missed?

try to change HEROES to heroes inside your in-memory-data.service — Gérôme Grignon, Jun 30 '20 at 07:08
oh my god. it works. Thanks a lot. but i didn't understand, it is just a local variable. how it is mapped to endpoint url? — c.sankhala, Jun 30 '20 at 07:15
it's the way the in memory module map your data to url so you don't have to configure it yourself as its goal is to help you to prototype quickly (not production friendly) — Gérôme Grignon, Jun 30 '20 at 07:24

score 2 · Accepted Answer · answered Jun 30 '20 at 12:17

2

Your urls must matchs the name of your data declared inside the in-memory-data.service.

In this situation, in order to query api/heroes, the createDb() function returned object must include a variable named heroes (rather than HEROES).

answered Jun 30 '20 at 12:17

Gérôme Grignon

3,859
1
6
18

i had the same problem but my variable was correctly named heroes. my problem was i had "return heroes;" instead of "return {heroes};" in the createDb() function. just adding this here in case of anyone having the same problem as me – Molbac Jan 09 '23 at 12:20

angular-tour-of-heroes gives 404 for 'api/heroes"

1 Answers1