从本地主机获取Json

18 浏览
0 Comments

从本地主机获取Json

我正在尝试从http://localhost:3000/clientes中获取一些Json，在Angular 5中，并将其加载到表格中。

当Json在/assets/目录下时，我可以直接加载到表格中。

以下是general.component.ts中的代码：

constructor (private httpService: HttpClient) { }
  myVals: string [];
  ngOnInit () {
    this.httpService.get('./assets/person.json').subscribe(
      data => {
        this.myVals = data as string [];   
      },
      (err: HttpErrorResponse) => {
        console.log (err.message);
      }
    );
  }

以下是我的表格主体内容：


                 {{item.ID}}
                 {{item.Name}}
                 {{item.CPF}}
                 {{item.body}}

我已经搜索了很多，但迄今为止没有找到能帮助我的东西。谢谢。

0

1 答案

0 Comments

问题：从本地主机获取Json的出现的原因是什么？

原因：问题的原因是在使用HttpClient时，没有指定响应的类型，导致在消费输出时不够明确和容易。

解决方法：

1. 创建一个接口Items，根据响应的类型进行更改。

export interface Items {
  ID: string; // 根据响应更改类型
  NAME: string;
  CPF: string;
}

2. 在general.component.ts中导入这个接口。

import { Items } from './路径/Items';

3. 将observable转换为Items数组类型。

private url ='http://localhost:3000/clientes';
public myVals = [];
ngOnInit () {
    this.httpService.get(this.url).subscribe(
      data => {
        this.myVals = data;   
      },
      (err: HttpErrorResponse) => {
        console.log (err.message);
      }
    );
}

通过以上步骤，问题就可以解决了。

0