json file cannot find in angular2

Question

I am trying to load a .json file from a service file in angular2. I install my angular2 app using angular-cli. My app file structure is like below

src > app > menu-item > menu-item.service.ts

menu-list.json

Here is my menu-item.service.ts file.

getMenuListObservable(): Observable<Menu[]> {
    return this._http.get('menu-list.json')
        .map((response: Response) => <Menu[]>response.json().menuList)
        .do(data => console.log(JSON.stringify(data)))
        .catch(this.handleError);
     }

http://localhost:4200/menu-list.json [HTTP/1.1 404 Not Found 173ms] Object { _body: "Cannot GET /menu-list.json ", status: 404, ok: false, statusText: "Not Found", headers: Object, type: 2, url: "http://localhost:4200/menu-list.json" }

If I place then menu-list.json file in the root directory then its work, but I don't want to place it on root directory. If I change the path name like that return this._http.get('src/app/menu-item/menu-list.json') its also give me same error msg.

Please give me a suggestion what I have to do for that.

Have you tried return this._http.get('app/menu-item/menu-list.json') ? Check this plunker for a similar example: plnkr.co/edit/60E2qb9gOjvkEAeR5CtE?p=info — eko
– eko, Commented Feb 17, 2017 at 16:52
@echonax, yes you are absolutely right, its working. Thanks a lot. — Mahfuja nilufar
– Mahfuja nilufar, Commented Feb 17, 2017 at 17:05

eko · Accepted Answer · 2017-02-17 17:08:25Z

2

It should be return this._http.get('app/menu-item/menu-list.json') Check this plunker for a similar example: http://plnkr.co/edit/60E2qb9gOjvkEAeR5CtE?p=info

answered Feb 17, 2017 at 17:08

eko

40.8k11 gold badges79 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

json file cannot find in angular2

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related