在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工作.

我修改了addon observable来返回数组

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

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

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