时间戳

首页 > 解决方案 > 类型“对象”不可分配给类型“NgIterable”| 空 | 不明确的'。在角 11

angular - 类型“对象”不可分配给类型“NgIterable”| 空 | 不明确的'。在角 11

问题描述

第一次学习角度和打字稿，不明白为什么这是无效的！

http.service.ts

export class HttpService {


  constructor(private http: HttpClient) { }

  getBeer() {
    return this.http.get('https://api.openbrewerydb.org/breweries')
  }
}

该api返回一个对象

the component its being used in: 


export class ListComponent implements OnInit {

  brews: Object;

  constructor(private _http: HttpService) { }

  ngOnInit() {
    this._http.getBeer().subscribe(data => {
      this.brews = data
      console.log(this.brews);
    }
  )
  }

}

我在行中遇到错误

brews: Object;

其中说：

错误 TS2322：类型“对象”不可分配给类型“NgIterable | 空 | 不明确的'。“对象”类型可分配给极少数其他类型。您的意思是改用“任何”类型吗？

我试过了：

brews: any;

和

brews: Object[] = [];

但似乎没有任何效果。

有人可以解释我哪里出错了吗？

该api返回一个对象，那为什么我不能这样做

brews: Object;

模板用于：

<h1>Breweries</h1>

<ul *ngIf="brews">
  <li *ngFor="let brew of brews">
    <p class="name">{{ brew.name }}</p>
    <p class="country">{{ brew.country }}</p>
    <a class="site" href="{{ brew.website_url }}">site</a>
  </li>
</ul>

标签： angulartypescript

解决方案

最好根据您的data. 但是如果你坚持使用匿名类型，你可能需要使用any[]类型来解决问题：

brews: any[];

您的服务将是这样的：

this._http.get('https://api.openbrewerydb.org/breweries').subscribe(data => {
      this.brews = data as any[]
      console.log(this.brews);
}

这是工作示例：StackBlitz

推荐阅读