classNameBindingsをボタンで操作するember.jsでハンドルバーに#viewを表示

Question

プロパティバインディングに基づいてハンドルバービューを使用して特定のボタンにクラスを表示させようとしています。私はember.jsが自分のサイト（http://emberjs.com/examples/todos/）にあるTodoアプリケーションのようなものをやっているし、 "Clear Completed"ボタンを消すことを試みているプロパティの値。

私はここで何をしているのかを示すjsfiddleを持っています（http://jsfiddle.net/boushley/XEdNg/）。 #viewタグの中にclassNameを追加すると、上手く表示されます。しかし、clasNameBindingsを追加すると、期待通りに動作しません。私はこれについて間違っているか、ここで何か壊れていますか？

アーロンは

Answer 1

私はここhttps://github.com/emberjs/ember.js/issues/322これを議論し、プロジェクトの人々の一つはここにhttps://github.com/emberjs/ember.js/issues/322#issuecomment-3332477（http://jsfiddle.net/aNZSD/）これを実行する方法の明確な方法を与え、これを助けた本質的には私が作成するために必要なButtonViewを拡張し、この新しいビューに必要なプロパティを配置するビューです。これがうまくいくはずです、私はちょうどこれを正しく見ていませんでした。

これは、これが他の人にとってより明確になることを望みます。

Answer 2

私はあまりにもclassNameBindingsと同様の問題を抱えていた覚えています。

代わりにhttp://guides.sproutcore20.com/using_handlebars.html#binding-class-names-with-bindattrをお試しください。

// Javascript for the view 
App.AlertView = SC.View.extend({ 
    priority: "p4", 
    isUrgent: true 
}); 

// Template 
<div {{bindAttr class="priority"}}> 
    Warning! 
</div> 

// Emits the following HTML 
<div class="p4"> 
    Warning! 
</div> 

あなただけisVisibleプロパティをバインドしようとし、その後、ボタンを表示/非表示にする場合。

isVisibleBinding: 'App.pageController.myProperty' 

これが役に立ちます。