Backbone.js - 将集合呈现为 HTML 选项标签答案

【问题标题】：Backbone.js - Render a collection as HTML option tagsBackbone.js - 将集合呈现为 HTML 选项标签
【发布时间】：2013-02-07 15:52:29
【问题描述】：

有一组我想渲染到模板中现有<select> 元素的项目。我遇到的问题是视图总是将<option> 列表包装在DIV 标记中。我怎样才能只呈现<option> 列表而没有任何包装元素？

模板：

<script type="text/template" id="template-select">
    <% _(elements).each(function(element) { %>
            <option value="<%= element.id %>"><%= element.name %></option>
    <% }); %>
</script>

查看：

myView = Backbone.View.extend({
    template: template('template-select'),
    render: function() {
        this.$el.html(this.template({
                elements: this.collection.toJSON()
            }));
        return this;
    }
});

【问题讨论】：

标签： backbone.js

【解决方案1】：

我假设您正在其他地方创建该视图的实例，添加渲染/将其添加到 <select> 元素。

你可以试试这样的：

var view = new myView({el: '#id-of-existing-select'});
view.render();

这将使视图使用现有的<select>，而不是生成<div>。

【讨论】：

感谢您的回答！我遇到的问题是，在构建 <select> 视图时，我想附加到的元素在 DOM 中不存在......知道如何解决这个问题吗？
还有一个问题：如果我设置了el，如何渲染出变化？通常我会做类似$('body').append(myView.render().el) 的事情。但是如果我设置 el 属性，则更改包括完整的元素 ...
如果你设置el你没有append，它已经在DOM中了。如果 <select> 不在 DOM 中，try setting tagName 改为“选择”并像以前一样渲染/附加。
选择已经在另一个视图的模板中设置，然后我想将<options> 列表附加到。因此，在我创建选项列表的那一刻，<select> 元素不存在于 DOM 中，而仅存在于另一个视图的 el 属性中。
使用 tagName:'select' 并从您的其他模板中删除 <select>。然后使用$('#select-container').html(myView.render().el)之类的东西。