2016-11-10 16 views
1

我最近遇到了「如何檢測服務中的更改並使其在組件中可見」的問題。組件中的DoCheck檢測服務中的更改

DoCheck(){ 
    if(this.componentVar != this.myService.serviceVar){ 
     this.componentVar = this.myService.serviceVar; 
    } 
} 

,而且運作良好:

我把它用DoCheck()解決了!但我沒有看到這是一個好方法,所以這是我的問題: 您認爲這個解決方案是一個很好的解決方案嗎?

+3

可能更容易在客戶端上訂閱服務的可觀察性並從那裏驅動更改或比較。 DoCheck被稱爲很多。請參閱https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html#!#docheck,瞭解以這種方式掛鉤的缺點 – silentsod

回答

0

$ doCheck被視爲一種「觀看」的方式來取代$ scope watch。我可以看到你的代碼綁定你的組件到服務變量。這是緊密耦合,不推薦。它也運行在每個消化循環中,通常會導致高性能問題。更好的方法是在組件變量上使用單向綁定。所以你的組件變成更可重用的轉儲組件。

var childComponent = { 
    bindings: { componentVar: '<' }, 
    controller: function() { 
    this.$onChanges = function (changes) { 
      if(changes.componentVar){ 
        //do something here 
      } 
    }; 
    } 
}; 

angular 
    .module('app') 
    .component('childComponent', childComponent); 
+0

確保您的代碼段實際*運行*包含適當的Angular版本和其他需要的東西。否則將其轉換爲正常的代碼塊。 –

+0

謝謝,改成正常的代碼塊 – hurricanew