Question

我正在使用Angular 5

在我的 app.component.ts 上，我目前有这些数据：

ngOnInit() {

    this.data = [
      {cols: 2, rows: 1, y: 0, x: 0},
      {cols: 2, rows: 2, y: 0, x: 2},
      {cols: 1, rows: 1, y: 0, x: 4},
      {cols: 1, rows: 1, y: 0, x: 5},
      {cols: 2, rows: 1, y: 1, x: 0}
    ];

}

这很好但我想把这些数据放在本地或远程的外部文件上。

我该怎么做？

Answer 1

如果可以删除和/或本地，我会保持一致性使用HttpClient来获取数据。因此，如果它是本地的，请将数据放在assets文件夹中的json文件中（假设您使用CLI）并从那里获取数据。如果它是远程/本地的，那么你不需要修改除了url之外的任何内容来获取数据。

<强> data.json：

[
  {"cols": 2, "rows": 1, "y": 0, "x": 0},
  {...}
]

<强> service.ts

getData() {
  // don't use 'any', type your data instead!
  return this.httpClient.get<any>('./assets/data.json')
}

<强> component.ts

ngOnInit() {
  this.myService.getData()
    .subscribe(data => {
      this.data = data;
    })
}

Answer 2

对于远程文件，您可以使用httpClient来调用它见here

Angular 5 - Oninit获取数据 - 本地或远程文件

2 个答案: