找不到不同的支持对象,异步管道和 ngFor angular2 中的问题

Cannot find a differ supporting object ,Async pipe and ngFor problems in angular2

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

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

class中的定义如上

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]

知道我做错了什么吗?

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

lblLeftAddons: Observable<InputAddon>;

lblLeftAddons: Observable<InputAddon[]>;

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

并且我将 addon observable 修改为 return array

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

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

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