2017-03-17 149 views
2

以下是使用rxjs Observables的簡單示例Angular 2組件。Angular 2中的Observable和ngFor

import { Component , OnInit } from '@angular/core'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/of'; 

    @Component({ 
    selector:'ob', 
    template: ` 

    <ul> 
     <li *ngFor="let x of obj | async"> 
      {{x}} 
     </li> 
    </ul>  
    ` 
}) 

export class ObComponent implements OnInit{ 

obj:Observable<number>; 

ngOnInit() { 
this.obj = Observable.of(1,2,3,4); 
} 

} 

此組件拋出以下錯誤

聯模板:15:12所造成的:無法找到類型 '編號' 的不同支承對象 '4'。 NgFor僅支持與陣列等Iterables綁定。

任何想法可能是什麼問題?

回答

2

Observable.of。以一個序列發射值,因此*ngFor通過異步接收單個值,而不是*ngFor預期的數組。

使用

obj:Observable<number[]>;//declare 

Observable.of([1,2,3,4])