2013-09-24 23 views
13

EmberJS /ハンドルバーを使用すると、条件が満たされている場合にのみ、どのようにしてクラスに要素を追加できますか?ハンドルバー条件付きクラス属性

<div {{#if isSearching}}class="foo"{{/if}}></div> 

擬似コードは少なく、より現実的です。

+0

これはうまくいきます。テンプレートデータ変数としてクラスリストを送信し、テンプレートの外でこれらの処理を行う場合は代わりにクラスリストを使用できます。または、カスタムヘルパーメソッドを使用することもできます...しかし、実際には、より簡単な方法があります。 –

+0

@SimonBoudriasしかし、動作しません。 if文の後にすべてのプロパティをエスケープします。 – alt

答えて

5

{{#if}}ヘルパーがHTMLにタグを作成するため、これは機能しません。代わりに、次の操作を行います。

<div {{bind-attr class="isSearching:foo"}}></div> 
+1

bindAttrは "古い" Ember構文btwです(より新しいバージョンでは使用されません)。 –

+0

(新しいものではbind-attrと呼ばれています) –

+0

ありがとうございます - 私の答えは – chopper

9

あなたがブール条件で{{bind-attr}}ヘルパーを使用する必要があり、あなたがread the guide about thisをすることができます。 isSearchingプロパティがコントローラである場合は、あなたの場合は

、あなただけ行うことができ、次のhttp://jsfiddle.net/NQKvy/240/

+0

です。ガイドへのリンクが壊れています。 – bmavity

46

{{バインドに:

<div {{bind-attr class="isSearching:foo"}}></div> 

あなたはこのフィドルにコード全体を見ることができますattr}}はdeprecatedです。あなたはEmber 1.10以上でもっと新しくbound attribute syntaxを使うことができます。

+0

これは私が探していた答え、感謝アダムです。 –

関連する問題