在Ember.js中啓用綁定按鈕的狀態

我只是用Ember.js弄溼了自己的腳，而且我碰到了一些我確信我不瞭解的東西。在Ember.js中啓用綁定按鈕的狀態

我有一個選定的對象控制器。它的內容是一個Ember.Object，它是當前選擇的模型。該模型有一個屬性（isDirty），基本上我希望我的表單上的保存按鈕僅在對象髒並需要保存時才能啓用。

我已經設法將表單很好地綁定了，但保存按鈕上的isEnabledBinding屬性或者沒有做任何事情，或者我沒有正確地連接綁定。

我準備了一個jsfiddle演示我的基本設置。

http://jsfiddle.net/blargity/fqc73/1/

我怎麼只有當isDirty是真的要啓用的按鈕？如果所選對象控制器上的內容屬性更改，則綁定也應該可以工作。

來源

2012-03-26 KevinBrownTech

問題是Ember.Button上沒有isEnabled屬性。您需要綁定到disabled屬性。

一種可能性是創建自定義Ember.Button爲您處理此問題，請參閱http://jsfiddle.net/LabpW/。

把手：

{{#view App.SaveModelButton modelBinding="model"}}Save{{/view}}

的JavaScript：

App.SaveModelButton = Ember.Button.extend({ 
    disabledBinding: Ember.Binding.not('model.isDirty') 
});

的使用Ember.Binding.not僅僅是寫自己的計算性能，快捷這將是這樣的：

App.SaveModelButton = Ember.Button.extend({ 
    disabled: function() { 
     return !Ember.getPath(this, 'model.isDirty'); 
    }.property('model.isDirty').cacheable() 
});

我也重構你的代碼位：

你混合create和extend：使用類create的實例和extend。有一個關於this
這是一種慣例來使用實例和大寫字母類小寫的一個很好的博客文章，所以它應該是App.controller代替App.Controller

來源

2012-03-26 07:30:00 pangratz

非常感謝您的回答，並糾正我的風格問題。 – KevinBrownTech 2012-03-26 23:23:57

這個效果很好，但是最近Ember的Ember.Button上有一個棄用警告。（我正在使用v1.0.pre-48-g138fbdf） – webjprgm 2012-12-05 20:15:50

我發現了一個辦法做到這一點而不使用現在不推薦使用的Ember.Button。

在車把上的模板：

<button {{action "save" target="controller"}} {{bindAttr disabled="view.isNotDirty"}}>Save</button>

在視圖：

isNotDirty: function(){ 
    return !this.get('controller.content.isDirty') 
}.property('controller.content.isDirty').cacheable()

（與Ember的版本我都有，Ember.Binding.not不存在。也許我需要更新，但文檔不顯示它，或許它實際上已被刪除。）

來源

2012-12-05 21:28:08 webjprgm

在Ember 1.4.0-beta.6中，正確的綁定是'{{bind-attr disabled = ...}}' – jevon 2014-04-02 04:39:26

通常bind-attr是與控制器內的屬性一起使用，但有時該屬性在視圖中。這個答案很好，因爲它顯示瞭如何做到這一點（使用'view。'前綴）。 – 2014-11-21 15:04:57

在Ember.js中啓用綁定按鈕的狀態

回答

相關問題