Angular2可觀察回調

我試着去實現一個簡單的回調，一旦可觀察到的完成，這裏是我的代碼：Angular2可觀察回調

ngOnInit() { 
    this.propertyService 
    .getProperties() 
    .subscribe(
     (data: ContentPropertyModel[]) => this.properties = data 
    ); 
    this.status = 'active'; 
}

但是狀態是可觀察的運行之前改變。關於如何在observable運行後更改this.status的任何想法？

來源

2017-02-16 rhysclay

移動this.status您訂閱的處理程序：

ngOnInit() { 
    this.propertyService 
    .getProperties() 
    .subscribe(
     (data: ContentPropertyModel[]) => { 
      this.properties = data 
      this.status = 'active'; 
     } 
    ); 
}

來源

2017-02-16 04:49:18 pixelbits

謝謝 - 多數民衆贊成在完美 – rhysclay

訂閱發生在三個參數（OnNext函數，誤差函數，完成功能）。

如果要運行代碼之後收到的每個項目，然後在代碼的第一個函數參數運行。如果你想在流完成後運行，那麼在最後一個函數參數中進行編碼。

ngOnInit() { 
    this.propertyService 
    .getProperties() 
    .subscribe(
     (data: ContentPropertyModel[]) => { 
      this.properties = data 
     }, 
     (err) => console.log(err), 
     () => this.status = 'active' 
    ); 
}

請參閱此鏈接http://reactivex.io/documentation/observable.html。

另外onError（）和Completed（）函數不適用於DOM事件。

來源

2017-02-16 04:56:49 Sekar

謝謝你的非常全面的答案 – rhysclay

是，作爲另一個答案中指出，必須設置subscribe處理程序中status。然而，這也意味着status根本不設置，直到觀察者發出第一個項目。我建議爲使status可觀察到的本身，你可以實現的東西像

this.status$ = this.propertyService.getProperties() 
    .startWith(false) 
    .map(b => b ? 'active' : 'waiting');

現在在你的模板顯示狀態

STATUS IS {{status$ | async}}

替代和顯示器將是waiting，直至觀察到第一次發生火災。

如果您需要訪問事件處理程序的status當前值，你可以用

logStatus() { 
    this.status$.take(1).subscribe(s => console.log("status is", s); 
}

這樣做。如果你以同樣的方式對待properties，作爲觀察的，

ngOnInit() { 
    this.properties$ = this.propertyService.getProperties(); 
    this.status$ = this.properties$.startWith(false).map(b => b ? 'active' : 'waiting'); 
}

然後你就可以避免你的ngOnInit中的所有訂閱，這些訂閱將需要被記住然後在ngOnDestroy被拆除。

來源

2017-02-16 05:11:07

Angular2可觀察回調

回答

相關問題