Question

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

我可以在/ assets /

中加载Json

这是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);
      }
    );
  }

这是我桌子的主体

<tr *ngFor="let item of myVals">
                 <td class="text-center" style="width: 15px;">{{item.ID}}</td>
                 <td class="text-center" style="width: 15px;">{{item.Name}}</td>
                 <td class="text-center" style="width: 200px;">{{item.CPF}}</td>
                 <td class="text-center">{{item.body}}</td>
             </tr>

我正在寻找很多东西，但迄今为止没有任何可以帮助我的东西。感谢

Answer 1

您可以告诉HttpClient响应的类型，使输出更容易，更明显。

export interface Items {
  ID: string;//change the type according to your response
  NAME: string;
  CPF:string;
}

import将其加入general.component.ts. 然后你可以将observable转换为类型Items Array

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

Answer 2

这是一个角色问题。我在这个链接中找到了我的问题的答案 How to enable cors in Nodejs

从Localhost获取Json

2 个答案: