Marionette CompositeView为Collection中的每个Model呈现自己而不是ItemView(Marionette Rails)

时间:2013-10-01 23:03:07

标签: ruby-on-rails backbone.js coffeescript marionette

基本上,我正在尝试将CompositeView渲染为带有表头的简单四列列表,其中集合中的每个模型都呈现为a并附加到。我只是稍微跟踪an example of Derick's只有一点点变化,但不幸的是有一些非常奇怪的结果。

视图不是呈现每个itemView,而是引用自身并为集合中的每个项重新呈现,从而生成新的表和表头。在此之前,它正在渲染复合视图。

我有一个itemView,其模板是一组项目,以及一个引用它的复合视图,它是一个表

CompositeView:

class App.module('Views.Parts').Index extends Backbone.Marionette.CompositeView
   template: 'parts/index'
   itemView: App.Views.Parts.Part
   tagName: 'table'
   itemViewContainer: 'tbody'
   appendHtml: (collectionView, itemView, index)->
           collectionView.$el.append(itemView.el)

ItemView:

class App.module('Views.Parts').Part extends Backbone.App.ItemView
       tagName: 'tr'
       template: 'parts/part'
       events:
               "click .destroy": "destroy"
       destroy: (e) ->
               e.preventDefault()
               @model.destroy()
       onRender: ->
               @stickIt()

控制器

class App.Controllers.Parts
       constructor: ->
               @parts = new App.Collections.Parts
               @parts.reset(App.parts)
               App.parts = null

       showView: (view)->
               App.mainRegion.show view

       index: ->
               view = new App.Views.Parts.Index
                       collection: @parts
               @showView view

我还听说过在CompositeView之前声明一个ItemView是必要的 - 但是因为它是一个Marionette Rails项目,所以这些视图实际上存在于不同的目录中。我是否必须以另一种方式宣布他们的订单或相互绑定他们?

2 个答案:

答案 0 :(得分:2)

您不希望itemViewContainerappendHtml。尝试删除后者,您的观点应该正确呈现。

答案 1 :(得分:2)

TL;如果没有定义,DR Marionette.CompositeView 将自身用作项目视图类型。在prototype上设置itemView属性,使其使用正确的项目视图

问题

在我们的案例中,问题是Marionette通过following logic获取 CompositeView ItemView

getItemView: function(item){
  var itemView = Marionette.getOption(this, "itemView") || this.constructor;

  if (!itemView){
    throwError("An `itemView` must be specified", "NoItemViewError");
  }

  return itemView;
}

我们已将 CompositeView 定义为:

class sm.Views.GreetingPicker extends Marionette.CompositeView
  template: 'greeting_picker'
  el: '.message-choice'
  itemView: sm.Views.WelcomeMessage

CompositeView ItemView &将它们绑在一起的布局在一个文件中(由Rails使用Sprockets提供),文件一次加载并且没有问题。

在我拆分布局 CompositeView & ItemView CompositeView 的appendHtml的两个参数与CompositeView的类型相同。这是由Marionette在开头提到的逻辑引起的。

解决方案

在初始化程序中,手动设置构造函数上的 itemView 属性。像这样:

class sm.Views.GreetingPicker extends Marionette.CompositeView
  initialize: ->
    @constructor::['itemView'] = sm.Views.WelcomeMessage