Question

在我的角度应用程序中，我想显示用户可以选择的产品列表。

因此，在我的html文件中，我编写了以下代码：

<section fxLayout="column" fxLayoutAlign="center center">
      <mat-selection-list #products>
        <mat-list-option *ngFor="let product of products">
            {{product.name}}
        </mat-list-option>
      </mat-selection-list>
</section>

在.ts文件中，我有以下代码：

  products;


  constructor(private productService: ProductService) { }

  ngOnInit() {
    this.loadAll();
  }


  private loadAll(): Promise<any> {
    this.products = [];
    return this.productService.getAll()
    .toPromise()
    .then((result) => {
        result.forEach(product => {
          this.products.push(product);
        });
    })
    .catch((error) => {     
        console.log(error);
    });
  }

我收到以下错误消息：

错误：找不到类型为“对象”的其他支持对象“ [对象对象]”。 NgFor仅支持绑定到数组等Iterable。

问题是：产品是一个数组。

仍然，我收到此错误消息，好像this.products实际上不是数组。

这是怎么回事？

Answer 1

您已经拥有一个数组，因此无需再次转换为数组，

  result.forEach(product => {
          this.products.push(product);
  });
  this.products = Array.of(this.products); //remove this line

错误消息“ NgFor仅支持绑定到数组等可迭代对象”的解决方案不起作用

1 个答案: