2015-07-11 130 views
0

我已升級到最新版本的ember。我注意到一個潛在的問題,即當觀察outercontext屬性的組件函數甚至在實際組件被初始化之前實際初始化它。Ember組件觀察者屬性

$燼版本

version: 1.13.1 
node: 0.12.6 
npm: 2.12.1 

爲了證明我有以下HBS其插入檢測成分:

{{test-component parentController=controller}} 

檢測成分的以前版本.js

feedLoadedChanged: function(){ 
     var self = this; 
     alert("feedLoadedChanged and self initialized" + self.get('parentController').get('feedLoaded')); 
}.observes('parentController.feedLoaded'), 

在之前的ember版本中,上述警報用於成功工作。然而在當前版本的ember中,self/this變量引用了Window對象而不是該組件。

所以我認爲這是由於feedLoadedChanged函數在它初始化之前被初始化的。

當前燼

的版本爲燼的當前版本我做了如下修改。 didInsertElement將自身組件捕獲到變量_self中,並且僅當該變量存在時才調用原始警報函數。

下面的代碼修復該問題:

export default Ember.Component.extend({ 
    didInsertElement: function(){ 
      var self = this; 
      self.set('_self', this); 
    }, 

    feedLoadedChanged: function(){ 
    var self = this.get('_self'); 
     alert('feedLoadedChanged'); 
    if(self){ 
     alert("feedLoadedChanged and self initalized" + self.get('parentController').get('feedLoaded')); 
    } else { 
     alert("feedLoadedChanged and self NOT initalized"); 
    } 
}.observes('parentController.feedLoaded') 
}); 

這是加載的應用期間occurrs警報的序列。

  1. feedLoadedChanged
  2. feedLoadedChanged和自我不initalized
  3. feedLoadedChanged
  4. feedLoadedChanged和自我initalizedtrue(這是原始的提醒)

所以我想知道如果這個初始化組件功能它之前的組件是自己的問題還是預期的行爲?

+0

僅供參考我已經提出這個錯誤https://github.com/emberjs/ember.js/issues/11719。不過有人建議我使用新的組件生命週期鉤子:http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html。解決這個問題。將很快提供正確答案 –

+0

組件掛鉤看起來像是一種很好的方式來獲得一些細粒度控制。 (雖然我自己不知道)。從你的例子中還要指出一些事情。不推薦'.observes',但是如果你真的需要一個觀察者。手動設置觀察員(僅略微)更好。例如在'init'內部hook this.addObserver()'。 'self.get('parentController')。get('feedLoaded')'等價於'self。get('parentController.feedLoaded')':)乾杯 –

+0

謝謝喬爾。按照以下步驟執行你的建議:) –

回答

0

使用與Joel建議的手動addObserver相結合的didInsertElement生命週期方法已解決該問題。

export default Ember.Component.extend({ 
    didInsertElement: function(){ 
     this.addObserver('parentController.feedLoaded',this,'feedLoadedChanged'); 
    } 

    feedLoadedChanged: function(){ 
    alert("feedLoadedChanged and self initalized" + this.get('parentController.feedLoaded')); 
    } 
});