angular - 在 angular2 中找不到不同的支持对象、异步管道和 ngFor 问题

Question

我有一个组件，该组件将应过滤并显示在模板中的对象数组作为输入。

  @Input() inputAddons: Array<InputAddon>;
  addOns: Observable<InputAddon>;
  lblLeftAddons: Observable<InputAddon>;

类中的定义如上。

ngOnInit(): void {
this.addOns = Observable.from(this.inputAddons);
this.lblLeftAddons = this.addOns.filter(function (x){
  return x.pos == 'left' && x.type == 'label'}
);

this.lblLeftAddons.subscribe(x => console.log(x));
}

这是我过滤数组的代码

在模板中我有这个代码

*ngFor="#addon of lblLeftAddons | async"

但它不起作用。我得到异常

Cannot find a differ supporting object '[object Object]' in [lblLeftAddons | async in InputText@14:10]

任何想法我做错了什么？

Answer 1

我对我的代码进行了一些修改就解决了这个问题。首先我更换

lblLeftAddons: Observable<InputAddon>;

和

lblLeftAddons: Observable<InputAddon[]>;

Observable 必须返回数组才能使 ngFor 工作。

我修改了可观察的插件以返回数组

this.lblLeftAddons = this.addOns.filter(function (x){

 return x.pos == 'left' && x.type == 'label'}
);

changeDetection: ChangeDetectionStrategy.OnPush我还在我的组件定义中添加了