Question

我正在尝试使用Backbone.Marionette来构建应用程序。应用程序通过REST调用获取其数据。

在这个应用程序中，我创建了一个包含以下字段的模型：

ID
名称
语言
型

我还创建了一个包含模型完整表单的ItemView。我正在使用的模板是：

    <form>
            <input id="model-id" class="uneditable-input" name="id" type="text" value="{{id}}"/>
            <input id="model-name" class="uneditable-input" name="name" type="text" value="{{name}}" />
            <select id="model-language" name="language"></select>
            <select id="model-type" name="type"></select>
            <button class="btn btn-submit">Save</button>
    </form>

（我正在使用Twig.js渲染模板）

我能够成功获取模型的数据并显示视图。

我现在要做的是使用选项填充模型语言和模型类型的选择框。 REST调用也将语言和类型字段限制为值，即我有一个语言列表和一个通过REST提供给我的类型列表。

我正在考虑有两个集合，一个用于语言，一个用于类型，为每个集合创建一个视图（即viewLanguageSelectOptions和viewTypeSelectOptions），它以上面指定的模板形式呈现选项。我不确定的是，这是否可行，或者在何处填充选项以及如何根据模型中的数据设置所选选项。我不清楚，即使通过查看可用的示例和文档，可以最好地实现Marionette视图类型。也许我看错了方向。

换句话说，我现在被困住了，我想知道你们中的任何一位Backbone Marionette用户都有建议或解决方案。希望你能帮忙！

Answer 1

在我所描述的场景中不需要为我的观点创建一个Select视图，因为我假设您的语言列表不会经常更改，并且唯一的一个porpouse是提供一个列表，从哪里选择一个值，这样您就可以使用jquery在视图的onRender或initializace函数中填充您的选择。

您可以在渲染视图之前调用REST服务并获取列表，并将此列表作为选项传递给视图，并在onRender函数上填充您的选择

var MyItemView = Backbone.Marionette.ItemView.extend({
    initialize : function (options) {
       this.languages = options.languages;
       this.typeList = options.typeList;
    },
    template : "#atemplate",
    onRender : function () {
         this.renderSelect(this.languages, "#languagesSelect", "valueofThelist");
         this.renderSelect(this.typeList, "#typesSelect", "valueofThelist")
    },
    renderSelect :function (list, element, value) {
        $.each(list, function(){
            _this.$el.find(element).append("<option value='"+this[value]+"'>"+this[value]+"</option>");
        });
    }
})


var languagesList = getLanguages();
var typeList = getTypesList();
var myItemView = new MyItemView({languages:languagesList,typeList :typeList });

希望这有帮助。

Backbone Marionette中的表格选择框

1 个答案: