Question

如果未选中复选框，请执行以下禁用按钮的示例，并在选中时启用它：

车把：

<form {{action "register" on="submit"}}>
  {{input type="checkbox" checked=isAgreed}}
  {{input type="submit" value="Register" class="btn btn-primary" disabled=isNotAgreed}}
</form>

使用Javascript：

App.ApplicationController = Ember.ObjectController.extend({
  content:{
    isAgreed:false
  },
  isNotAgreed:function(){
    return !this.get('isAgreed');
  }.property('isAgreed'),
  actions:{
    register:function(){
      alert("registered");
    }
  }
});

如此JSBin中所示。

我想知道是否有更清洁的方法。例如，移除isNotAgreed可观察属性，只使用我的手柄模板中的某些内容，例如{{input type="submit" value="Register" disabled=!isAgreed}}。有没有办法做到这一点？

Answer 1

目前在车把模板的绑定属性中不存在not operator !。

您可以使用计算属性宏not来获得一些语法糖：

所以而不是：

isNotAgreed:function(){
  return !this.get('isAgreed');
}.property('isAgreed')

你可以使用：

isNotAgreed: Ember.computed.not('isAgreed')

您可以看到所有avaliable computed macros here

我希望它有所帮助

Answer 2

或者，您可以绑定一个disabled类isAgreed，false为<button type="submit" {{bind-attr class=":btn :btn-primary isAgreed::disabled"}}>Register</button>，如下所示。

disabled

由于你也使用 twitter-bootstrap ，这个{{1}}类会给按钮提供类似禁用的行为。

以下是您问题的简化bin。

“不是”车把模板内的操作员

2 个答案: