Question

我刚刚和Ember.js擦肩而过，我发现了一些我确信我不理解的东西。

我有一个选定的对象控制器。它有内容，它是一个Ember.Object，它是当前选择的模型。该模型有一个属性（isDirty），基本上我希望我的表单上的保存按钮仅在对象脏了并且需要保存时启用。

我设法将表单绑定得很好，但是保存按钮上的isEnabledBinding属性要么没有做任何事情，要么我没有正确地连接绑定。

我准备了一个jsfiddle来展示我的基本设置。

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

如果isDirty为true，我如何才能启用该按钮？如果所选对象控制器上的content属性发生更改，绑定也应该有效。

Answer 1

我找到了一种方法，可以不使用现已弃用的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不存在。也许我需要更新，但是文档也没有显示它，所以也许它实际上被删除了。）

Answer 2

问题是isEnabled上没有Ember.Button属性。您需要绑定到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
对于实例使用lowerCase而对类使用UpperCase是一种惯例，因此它应该是App.controller而不是App.Controller

在Ember.js中绑定启用状态的按钮

2 个答案: