2012-03-15 17 views
1

ハンドルバーテンプレートから子ビューにCSSクラスを追加したいと思います。シフトクラス名プロパティに関する特別な何かがhttp://jsfiddle.net/sohara/PKMTn/2/ハンドルバーテンプレートから子ビューにCSSクラスを追加するには

あります:

App = Ember.Application.create() 

App.ParentView = Ember.View.extend({ 
    foo: 'bar', 
    content: 'Hello', 
    ChildView: Ember.View.extend({ 
     classNames: this.get('parentView').get('classesToAdd') 
    }) 
}); 

私はここjsfiddleを持って次のように

Uncaught TypeError: Object [object DOMWindow] has no method 'get' 

私のコードは次のように私は現在、エラーを取得していますEmber.ViewからDOM要素へのコンテキスト?あるいは、私はこれを達成できる他の方法がありますか?

答えて

2

あなたはhttp://jsfiddle.net/WCjda/1/

ハンドル参照、アクセスclassesToAddを視野にinitを上書きすることができます:私は実際にその最初に試みた

App = Ember.Application.create() 

App.ParentView = Ember.View.extend({ 
    foo: 'bar', 
    content: 'Hello', 
    ChildView: Ember.View.extend({ 
     init: function() { 
      this._super(); 
      var classes = this.get('classesToAdd'); 
      this.set('classNames', Ember.makeArray(classes)); 
     } 
    }) 
});​ 
+0

ありがとうございます。これは基本的に私が達成しようとしていたものでした。私はハンドルバーのテンプレートを乾かしたいと思っていました。ここではさらに乾燥したjsfiddleがあります:http://jsfiddle.net/sohara/WCjda/3/ - テンプレート内のchildViewを宣言する必要はありません。注目すべきことは、私は後で、CSSセレクタのより創造的な使用によって同じ効果を達成できることを認識しました。 (単にparentViewでクラスを宣言し、div.my-class div {#... cssの属性}の行に沿ってセレクタを作成しますが、これは私のCSSのクリーナーを保持します。 –

+1

通常のember-viewクラスはクラス名の配列に追加されず、配列は置き換えられないため、子ビューのイベント処理は中断されます。次のような解決策があります。http://jsfiddle.net/sohara/ WCjda/4 /問題の詳細な説明は次のとおりです:https://github.com/emberjs/ember.js/issues/490 –

0

ビューオブジェクトがインスタンス化されていないため、classNames子ビューの宣言でthisを使用することはできません。

ただし、バインディングを使用することはできます。 Emberjs.comの「HTML要素のカスタマイズ」セクションのドキュメントを参照してください。

+0

<script type="text/x-handlebars"> {{#view App.ParentView}} {{#view ChildView classesToAdd="my-class"}} hello {{/view}} {{/view}} </script>​ 

JavaScriptを。私はclassNamesBindingを設定していましたが、別のエラーが発生しました。 –