Angular 角度http客户端模块未显示响应

我试图在Angular 6中调用一个API（JSONPlaceholder posts API），但在模板中获取任何结果时遇到问题

这是来自服务文件的api

  private _url = 'https://jsonplaceholder.typicode.com/posts';
  constructor( ) { }

  getBU() {
    return this._url;
  }

我的ts组件

  ngOnInit(): void { // adding the lifecycle hook ngOnInit
    this.http.get<DataResponse>(this.api.getBU()).subscribe(data => {
      this.vals = [data];
    });
  }

显示结果的模板

  <li *ngFor="let item of vals">
      {{item.title}}
  </li> 

{{item.title}

如果我使用这个api

https://jsonplaceholder.typicode.com/posts/1

然后我可以看到结果

url返回对象的数组，您将其放入另一个数组中

请尝试以下操作：

  ngOnInit(): void { // adding the lifecycle hook ngOnInit
      this.http.get<DataResponse[]>(this.api.getBU()).subscribe(data => {
           this.vals = data;
      });
  }

ngOnInit（）：void{//添加生命周期钩子ngOnInit
this.http.get（this.api.getBU（））.subscribe（数据=>{
this.vals=数据；
});
}

如果执行此操作，将出现一个错误：找不到类型为“object”的不同支持对象“[object object]”。这就是我将其设置为ArrayID的原因。您是否将get响应从

DataResponse

更改为

DataResponse[]

？

  ngOnInit(): void { // adding the lifecycle hook ngOnInit
      this.http.get<DataResponse[]>(this.api.getBU()).subscribe(data => {
           this.vals = data;
      });
  }