木偶:意想不到的缺失itemViewContainer

时间:2013-11-20 22:33:52

标签: model-view-controller marionette composite

我收到了一个'Missing itemViewContainer'错误,这是我没想到的。我的模块看起来像这样:

@App.module 'InstagramApp.List', (List, App, Backbone, Marionette, $, _) ->

    class List.ItemView extends Marionette.ItemView
        template: '#instagram_item_template'

    class List.CompositeView extends Marionette.CompositeView
        el: '#bb-instagram'
        className: 'large-3 medium-6 columns projects__project'

        events:
            'click .js-next-photo': 'handleNextClick'
            'click .js-prev-photo': 'handlePrevClick'

        handleNextClick: (e) ->
            e.preventDefault()
            console.log 'next photo'

        handlePrevClick: (e) ->
            e.preventDefault()
            console.log 'previous photo'

        template: '#instagram_list_template'
        itemView: List.ItemView
        itemViewContainer: '#bb-photos-container'

我的模板看起来像这样:

<script id="instagram_list_template" type="text/template">
    <div class="bg-pattern photos">
        <div class="photos__inner">
            <h4 class="photos__header">I.Instagram</h4>
            <div id="bb-photos-container"></div>
            <a href="#" class="photos__button photos__button--next js-next-photo"><img src="/assets/img/vendor/photos-btn-next.png" alt=""></a>
            <a href="#" class="photos__button photos__button--prev js-prev-photo"><img src="/assets/img/vendor/photos-btn-prev.png" alt=""></a>
        </div>
    </div>
</script>

所以我的#bb-photos-container元素明显被定义了...有关这里发生了什么的想法吗?

我在这里打电话:

@App.module 'InstagramApp.List', (List, App, Backbone, Marionette, $, _) ->

    List.Controller =

        listPhotos: ->

            photos = App.request 'photo:entities'
            instagramView = new List.CompositeView({ collection: photos })

            $('#bb-projects-list').append(instagramView.render())

2 个答案:

答案 0 :(得分:1)

无需在此List.CompositeView

中设置el

然后你可以做

$('#bb-projects-list').append(instagramView.render().el)

更好的方法是将bb-projects-list定义为一个区域,然后调用

this.bbProjectsList.show new List.CompositeView({ collection: photos })

答案 1 :(得分:0)

为什么要定义el?如果您要将该视图附加到#bb-projects-list我猜您希望从模板创建该视图,而不是从现有元素中创建。

尝试删除该行

el: '#bb-instagram'