8

顧客データ (firstName、lastName) で満たされた次のテンプレートがあり、 divItemViewに a を追加したいと考えています。CollectionView.addresses

テンプレート

<script type="text/html" id="template-customer-details">
    <h4><%= firstName %> <%= lastName %></h4>
    <button class="edit">Edit</button>
    <h5>Addresses</h5>
    <div class="addresses">...</div>
</script>

レイアウト

Layout.Details = Backbone.Marionette.ItemView.extend({
    template: '#template-customer-details',

    regions: {
        addresses: ".addresses"
    },

    serializeData: function () {
        return this.model.attributes;
    },

    initialize: function () {

        this.addressList = new App.Models.AddressList();

        // Error!
        this.regions.addresses.show(this.addressList);

        this.bindTo(this, "render", this.$el.refresh, this.$el);
        this.model.bind("change", this.render.bind(this));
    }
});

「Uncaught TypeError: Object .addresses has no method 'show'.」というエラーが表示されます。

ビューが読み込まれるまで待つ必要がありますか?

4

1 に答える 1

10

少し混乱していると思います。AnはプロパティItemViewに対して何もしません(クラスのregionsことを考えているかもしれません) 。Applicationthis.regions.addresses.show".addresses".show

CompositeViewこの場合、a (顧客データに使用できる) と AddressList に使用できる a を組み合わせたaItemViewをCollectionView使用することをお勧めします。ItemViewまた、アドレスに対して個別に定義する必要があります (はコレクション内の各項目に対して をCollectionView作成するだけです)。ItemView

このようなもの（私はテストしていないので、完全に正しいとは限りません）：

AddressView = Backbone.Marionette.ItemView.extend({
    template: '#addressTemplate'
});

Layout.Details = Backbone.Marionette.CompositeView.extend({
    template: '#template-customer-details',
    itemView: AddressView,
    itemViewContainer: '.addresses'
});

// Then create your view something like this:
new Layout.Details({
  model: new App.Models.CustomerDetails(),
  collection: new App.Models.AddressList()
});

また、マリオネットが通常それを処理するため、例のように change & render イベントを具体的にバインドする必要はないと思います (serializeData の実装と同じで、デフォルトの実装と漠然と同じように見えます)。

于 2012-12-18T21:51:03.370 に答える