3

チェックボックスがチェックされていない場合はボタンを無効にし、チェックされている場合は有効にする次の例を見てください。

ハンドルバー:

<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}}です。これを行う方法はありますか?

4

2 に答える 2

3

または、次の場合にdisabledtrue になるクラスをバインドできます。isAgreedfalse

<button type="submit" {{bind-attr class=":btn :btn-primary isAgreed::disabled"}}>Register</button>  

twitter-bootstrapも使用しているため、このdisabledクラスは無効のような動作をボタンに与えます。

これは、問題の単純化されたビンです。

于 2013-09-09T15:21:38.800 に答える
3

!現時点では、ハンドルバー テンプレートのバインディング プロパティにnot 演算子は存在しません。

計算されたプロパティ マクロを使用notして、いくつかの構文シュガーを持たせることができます。

したがって、代わりに:

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

あなたが使用することができます:

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

ここで、利用可能なすべての計算済みマクロを確認できます

役立つことを願っています

于 2013-09-09T15:03:26.053 に答える