Angular:无法使用 HttpClient 获取本地 json

Vis*_*ati 2 http typescript angular angular5

HttpClient我正在使用提供的最新组件Angular5来发出本地 json 的 get 请求,但从那以后我收到了 404 错误。我已经HttpClientModule在我的app.module.ts.

文件夹结构快照:

在此输入图像描述

我正在从博客详细信息组件进行调用blog-list.json。这是我的代码:

  constructor(private http: HttpClient) {
  }

  ngOnInit(): void {
    // this.http.get('https://jsonplaceholder.typicode.com/posts/1').subscribe((data:Blog[]) => {
    this.http.get('app/api/blog-list.json').subscribe((data:Blog[]) => {
         this.blogs = data;
    });
  }
Run Code Online (Sandbox Code Playgroud)

我收到以下错误:

GET http://localhost:909/app/api/blog-list.json 404 (Not Found)
Run Code Online (Sandbox Code Playgroud)

即使我尝试通过点击http://localhost:909/src/app/api/blog-list.json直接在浏览器中打开文件,我也会在那里提供应用程序而不是 json 文件。

请注意,对 Web 上的 Rest api 的注释请求成功,但仅调用本地 json 文件失败。

Vis*_*ati 6

我能够解决这个问题,但它一开始发生的原因有点奇怪。

为此,我必须更新 .angular-cli.json 并在 asset 属性中添加 api 文件夹的路径。现在资产属性如下所示:

"assets": [
    "assets",
    "app/api",
    "favicon.ico"
 ]
Run Code Online (Sandbox Code Playgroud)

  • 我想补充一点,我只需要使用“api”而不是“app/api”,最重要的是我必须停止服务器并使用 ngserve -o 重新启动它 (2认同)