2

これまでのところ、文書化されていない場合でも、必要な機能はember.jsに含まれているため、何かが足りないと思います。（Yay github）

では、条件付きサブビューを持つビューでjquery.uiをどの程度正確に使用する必要がありますか？

だからこれが私のテンプレートだと言う

<ul>
    <li>Item 1</li>
    {{#if someBinding}}
    <li>Item 2</li>
    {{/if}}
    <li>Item 3</li>
</ul>

そして、私の対応する見解では...

someView = Ember.View.extend({
    ...
    didInsertElement: function() {
        this.$('ul>li').button();
    }
    ...
});

したがって、これに伴う問題は、ビューがアイテム1と3を使用してDOMにレンダリングされ、didInsertElementが呼び出されることです。そのため、アイテム2は正しく作成されません。

また、条件付きビューがDOMに追加される前に、手動で「someBinding」を監視すると起動するため、これは役に立ちません。

それで、すべてのビューが入ってバインディングが同期されたら、jQueryを呼び出すことができるイベントまたは何らかの方法はありますか？

4

1 に答える 1

2

このソリューションは、「静的」レンダリング(stuffレンダリング前に設定され、変更されない値...) で機能します。

ハンドルバー

<script type="text/x-handlebars" data-template-name='app-view'>
    <ul>
        <li>Item 1</li>
        {{#if view.stuff}}
        <li>Item 2</li>
        {{/if}}
        <li>Item 3</li>
    </ul>
</script>​

JS

App.ApplicationView = Ember.View.extend({
    templateName: 'app-view',

    stuffBinding: 'App.stuff',

    didInsertElement: function () {
        this.$('ul>li').button();
    }
})

view.ビューにスコープがありません。

JSFiddle の作業はこちら: http://jsfiddle.net/MikeAski/H6MNj/

stuff時間の経過とともに変化する値については、Item 2レンダリングを分離し、条件付き表示ロジックを含むサブビューにネストしてみてください。

ハンドルバー

<script type="text/x-handlebars" data-template-name='app-view'>
    <ul>
        <li>Item 1</li>
        {{#view view.stuffView}}Item 2{{/view}}
        <li>Item 3</li>
    </ul>
</script>​

JS

App.ApplicationView = Ember.View.extend({
    templateName: 'app-view',

    didInsertElement: function () {
        this.$('ul>li').button();
    },

    stuffBinding: 'App.foo.bar',

    stuffView: Ember.View.extend({
        tagName: 'li',

        stuffBinding: 'App.foo.bar',

        isVisible: function() {
            var stuff = this.get('stuff');
            return stuff;
        }.property('stuff'),

        didInsertElement: function () {
            this.$().button();
        }
    })
})

JSFiddle 更新 @ http://jsfiddle.net/MikeAski/H6MNj/3/

別の可能なアプローチは、CollectionView（またはeachヘルパー）を使用して、異なる場合があるアイテムのリストをレンダリングすることです。

サンプルをご希望の場合はお知らせください。

于 2012-07-26T06:36:21.357 に答える