json - Angular 4 404错误-使用http get方法调用json文件angular 4 webpack

Question

我有一个本地 json 文件并尝试从 Http get 方法读取。应用程序在控制台 (404) 上抛出异常。我已经读过，如果您使用 webpack，则 Assets /数据对于 angular-cli.json 不可用。我正在使用网络包。您知道将 json 文件放在哪里以便读取吗？

import {IProduct} from './product.model';

@Injectable()
export class ProductService {
    private productUrl = require('./product.json');

    constructor(private _http: HttpClient) { }

    getProducts(): Observable<IProduct[]> {
        return this._http.get<IProduct[]>(this.productUrl)
            .do((data) => console.log('products: ' + JSON.stringify(data)))
            .catch(this.handleError);
    }
}

其中 product.json 与 ProductService 位于同一目录中。

Answer 1

使用 webpack，无论您将 json 文件存储在何处，您都可以从任何地方访问它，但始终从 src 文件夹开始。

所以它应该看起来像这样:

return this._http.get<IProduct[]>('src/app/services/product.json')

即标记从 src 开始的 json 文件的完整路径。