在Marionette CompositeView中选择列表

时间:2013-05-08 18:36:58

标签: backbone.js marionette

我正在使用Marionette尝试渲染一系列问题。每个问题都可以有一个问题类型的选择列表,这些问题类型也将来自服务器。我宁愿将此列表保留在json的顶层而不是每个问题上。有没有办法循环ItemView中的问题,但仍然可以访问模板中的问题类型?

我可以将此作为一个每次重新渲染的大型模板,但我宁愿避免这种情况。

JSON:

var json = {
        questions: [
            { id: 1, questionType: "FreeText", label: "What is your name?" }
        ],
        questionTypes: [
            { label: "Free Text", qtype: "FreeText" },
            { label: "Single Select", qtype: "Select" },
            { label: "Multi Select", qtype: "MultiSelect" }
        ]
    };

模板:

{{#each questions}}
                <div class="question-editor">
                    <button class="remove-question" data-id="{{this.id}}">X</button>
                    <label for="QuestionType">Question Type:</label> 
                        <select name="QuestionType">
                            {{#each ../questionTypes}}
                                <option value="{{this.qtype}}" {{#isOptionSelected ../questionType this.qtype}} selected="selected" {{/isOptionSelected}}>{{this.label}}</option>
                            {{/each}}
                        </select>
                        <br />
                        <label for="Label">Label:</label> 
                        <input type="text" name="Label" value="{{this.label}}" />
                </div>
            {{/each}}

1 个答案:

答案 0 :(得分:0)

你可以使用木偶的CompositeView。

来自木偶文件的

ItemView = Backbone.Marionette.ItemView({
  initialize: function(options){
    console.log(options.foo); // => "bar"
  }
});

CollectionView = Backbone.Marionette.CompositeView({
  itemView: ItemView,

  itemViewOptions: {
    foo: "bar"
  } 
});

您可以将questionTypes作为每行的itemViewOptions传递