3

次のテンプレートを使用してリスト要素をレンダリングするビューがあります。

   {{#each item in controller}}
       {{view App.ItemView}}        
    {{/each}}

各アイテムのIDが対応するitemViewのIDである必要があります。これが私の最初の試みですが、うまくいきません：

App.ItemView = Ember.View.extend({
    elementId: Ember.computed(function(){
        return this.getPath('item.id');
    }),
    templateName: 'item'
});

私が間違っていることは何ですか？

ここで私の問題を示すjsfiddleを見つけることができますhttp://jsfiddle.net/jrabary/vk4Ze/

4

2 に答える 2

2

現時点では、ビューはelementIdプロパティを計算する必要がありますitemが、まだ設定されていないため、ここで問題が発生しています...

アイテムが利用可能になったときに ID を設定したい場合は、Ember が変更する DOM 要素を取得できるようにする必要があります。つまり、Ember は要素の ID を設定する必要があります。言い換えれば、Ember は要素 id を使用して DOM が所有/制御する要素への参照を保持するため、現時点では不可能です。

ただし、ビューには表示されたアイテムがバインドされているため、後でアイテムを取得できます。あなたの根底にあるニーズは何ですか？

編集

アイテムの ID に従って要素のクラスをカスタマイズするサンプルを次に示します: http://jsfiddle.net/MikeAski/ZAHxm/

于 2012-06-12T12:12:18.267 に答える
2

上記の答えは私を助けました。最後に、ビューのラッピング タグの ID 属性を特にモデルの ID に設定したいと考えました。ビューの didInsertElement フックを使用して、現在レンダリングされている要素のコンテキストに this.get('context').get('anyProperty') でアクセスし、DOM 要素自体 (jQuery オブジェクトとして) に this.$ でアクセスできることがわかりました。 (). 長い道のりのようですが、よりクリーンな方法が見えませんでした。

App.MyView = Ember.View.extend({
    templateName: 'MyTemplate',
    didInsertElement: function(e){
        this.$().attr('id', this.get('context').get('id'));
    }
});
于 2013-04-28T13:05:00.167 に答える