EmberJS計算屬性基於陣列不工作

我有一個EmberJS控制器具有以下計算屬性：EmberJS計算屬性基於陣列不工作

hasSelectedRequirements: Ember.computed('selectedRequirements.[]', function() { 
    console.log("this should get printed but it doesn't"); 
    return this.get('selectedRequirements').length > 0; 
}),

其設定我正在使用模板來有條件地顯示HTML一個布爾標誌。

我也有一個按鈕，即，當點擊時，採用的形式的數據和如果我改變addRequirement函數將此代替通過調用addRequirement動作

actions: { 
    addRequirement() { 
     ... 
     // extract data from form and create the requirement variable 

     var selectedRequirements = this.get('selectedRequirements'); 
     selectedRequirements.push(requirement); 
     this.set('selectedRequirements', selectedRequirements); 

     console.log(this.get('selectedRequirements')); // does print as expected 
    } 
}

推到selectedRequirements數組中的元素，然後如預期的那樣hasSelectedRequirements計算屬性的功能處理程序運行，並且執行console.log語句的工作：

actions: { 
    addRequirement() { 
     ... 
     // extract data from form and create the requirement variable 

     var selectedRequirements = this.get('selectedRequirements'); 
     selectedRequirements.push(requirement); 

     // create a new, local array 
     var arr = new Array(); 
     arr.push(1); 

     this.set('selectedRequirements', arr); 

     console.log(this.get('selectedRequirements')); // does print as expected 
    } 
}

它好像Ember的計算性能依賴於陣列上被觀察的是作爲一個COMPLE不同的陣列？

問題是計算出的屬性沒有意識到一個元素已被添加到selectedRequirements數組中，並且計算的屬性函數永遠不會被調用（console.log語句從不運行）。爲什麼計算屬性無法識別selectedRequirements數組已被修改，以及如何修復計算出的屬性代碼？

來源

2016-07-07 lkgarrison

爲什麼不你只需使用'hasSelectedRequirements：Ember.computed.bool（'selectedRequirements.length'）'？順便說一下，使用'pushObject'，而不是'push'。 – 2016-07-07 19:57:56

使用pushObject像this.get('selectedRequirements').pushObject(obj);

來源

2016-07-07 19:56:41

Ember MutableArray類中的pushObject方法正是我所需要的。我無法告訴你我搜索了多長時間，但找不到這個問題的答案。我知道潛在的問題是什麼，但不是Ember解決方案。希望這篇文章能夠幫助其他人。 – lkgarrison

@lkgarrison酷。所以如果這個問題解決了，請接受我的文章作爲答案 –

似乎Ember的計算屬性（至少使用陣列觀察。[]語法）要求以識別變化的新的數組。因此，我已經找到了最好的解決辦法是使用切片創建數組的副本：

actions: { 
    addRequirement() { 
     ... 
     // extract data from form and create the requirement variable 

     var selectedRequirements = this.get('selectedRequirements'); 
     selectedRequirements.push(requirement); 
     this.set('selectedRequirements', selectedRequirements.slice(0)); 

     console.log(this.get('selectedRequirements')); // does print as expected 
    } 
}

這保證了hasSelectedRequirements計算的屬性各addRequirement動作被調用時設置適當

來源

2016-07-07 20:00:09 lkgarrison

EmberJS計算屬性基於陣列不工作

回答

相關問題