Backbone：视图内的视图列表

让我先展示我需要什么，以便您能够理解我的问题。 我有一个联系人视图，例如：

ContactView = Backbone.View.extend({
    template: _.template("Name: <%= name %>
                          E-mail: <%= email %>
                          Phones
                          <%= label1 %> - <%= number1 %>
                          <%= label2 %> - <%= number2 %>"),
    render: function() {
       var contact = this.template(this.model.toJSON());
       this.$el.html(contact);
    }
});

到目前为止一切顺利，问题是电话部分是一个列表，我的模型包含一系列电话，我需要将其动态地放入该模板中。

我的想法是创建另一个模型并为此查看 Phone 和 PhoneView。 然后在 ContactView 中我将创建一个方法 render_phones，例如：

render_phones: function() {
    var phones = this.model.get('phones');
    var phones_str = "";
    for (var i in phones) {
        var phone = new Phone(phones[i]);
        var phoneView = new PhoneView({model: phone});
        phones_str += phoneView.render();
    }
    return phones_str;
}

我将 ContactView 模板更改为：

template: _.template("Name: <%= name %>
                      E-mail: <%= email %>
                      Phones
                      <%= phones %>"),

但是如何让我的渲染方法获取渲染的电话列表并将其放入模板中？

我找不到处理这种情况的模式。而且代码开始看起来不太好。

ps：这只是一个例子，我的应用程序还有其他几个部分需要这个，一个需要生成列表中内容的子视图的视图。

看起来您正在使用 underscore.js 来渲染模板，underscore.js 提供了一种方法渲染集合在模板内（看第二个例子）。例如

template: _.template("Name: <%= name %>
                          E-mail: <%= email %>
                          Phones
                <% _.each(phones, function (phone) { %>
                 <%= label %> - <%= number %>
                <% }); %>"),

您还可以为每个模型渲染单独的视图，并在同一渲染模型中修改el在那里渲染它，但除非你需要视图（例如内容会改变或者你正在监听事件），否则这样做可能不值得。这是一个如何实现这一目标的示例

render: function () {
  this.$el.html(this.model.toJSON());
  _.each(this.model.get('phones'), function(phone) {
    this.$el.find('.phoneArea').append(new phoneView({model: phone}).render().el));
  },this);
  return this;
}

另外，如果您要走这条路线，请注意，缓存视图可能是值得的，但同样，如果您需要的只是渲染内容，那么只需将电话号码保留为数组并将其渲染在模板。