Получить JSON из файла машинописи

Question

У меня есть этот код в моей службе

import {Injectable} from '@angular/core'; 
import {Http, Headers, RequestOptions} from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import {Client} from "../clients/client"; 
import {Observable} from "rxjs/Observable"; 


@Injectable() 
export class ClientsService { 


    private clientUrl = './client.json'; 

    private headers = new Headers({ 'Accept': 'application/json' }); 
    private options = new RequestOptions({ headers: this.headers }); 

    private client : Client; 

    constructor(private http:Http) {} 

    getClient() : Observable<any>{ 
    return this.http.get(this.clientUrl, this.options) 
     .map(res => res); 
    } 
} 

и в моем компоненте я звоню его:

this.client = this.clientsService.getClient() 
    .subscribe(data => { 
    console.log(data); 
    }); 

Но я получаю 404 ошибку

Но у меня есть этот файл json в той же папке, где мое обслуживание является.

Что случилось?

Answer 1

Вам необходимо указать абсолютный путь от базового пути. Мол, path/to/Services/client.json

Вот пример: https://plnkr.co/edit/60E2qb9gOjvkEAeR5CtE?p=preview

Answer 2

Если вы используете угловые-кли Держите файл JSon внутри папки Assets (параллельно приложение директории) каталог

В вашем случае вам нужно создать файл как активы /client.json

return this.http.get('/client.json')) 
    .map((response: Response) => { 
     console.log("mock data" + response.json()); 
     return response.json(); 
    } 
    ) 
    .catch(this.handleError); 
} 

Примечание: здесь вам нужно только, чтобы дать путь в папку активы как активы/client.json, то вам нужно написать путь /client.json

Если вы используете webpack, тогда вам нужно следить за той же структурой внутри общей папки, что и аналогичная папка с ресурсами.