是否可以在 stackblitz 上使用 http.get() 检索 json 数据文件答案

【问题标题】：Is it possible to retrieve a json data file with http.get() on stackblitz是否可以在 stackblitz 上使用 http.get() 检索 json 数据文件
【发布时间】：2022-01-10 01:22:13
【问题描述】：

我有一个看起来像这样的角度服务：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, of } from 'rxjs';

@Injectable({
  providedIn: 'root',
})
export class ApiService {
  constructor(private http: HttpClient) {}

  getDataHttp(): Observable<any> {
    return this.http.get(
      'http://localhost:4200' + '/assets/data.json'
    );
  }
}

在本地运行 Angular，这将在 assets 目录中检索 json 文件 data.json。

是否可以在 Stackblitz 上做同样的事情？该网址会是什么样子？

编辑：Stackblitz-https://stackblitz.com/edit/angular-ivy-zptuyp

【问题讨论】：

你试过什么？展示您的 stackblitz 以及您面临的问题

标签： angular stackblitz

【解决方案1】：

是的，有可能。

直接从资产中给出路径，像这样 -

this.httpClient.get('assets/data.json');

查看工作示例here

即使你也可以在本地使用相同的方式。

【讨论】：

【解决方案2】：

由于包含数据的文件已经存在于项目中，它不需要任何 localhost 或其他东西。当您有一个实际的后端 API 来获取您想要的数据时，您将需要它。但由于它只是您应用程序中的一个文件，因此您无需这样做。

此外，如果您确定您的应用程序本身将包含数据，而不是将其存储为 json 文件，您可以将其存储为 const 值并从您想要的任何位置读取。

请在此 stackblitz 中找到它：https://stackblitz.com/edit/angular-ivy-d1ocqb?file=src%2Fapp%2Fapp.component.html

【讨论】：