0

我试图在一个视图中使用两个模型，因此是模板，但是在尝试了这个问题中显示的示例之后：Backbone.js: complex views combined multiple models我遇到了一些错误。

首先，如果我尝试使用视图模型来组合两个模型，如下所示：

var model = new Backbone.Model();
model.set({ image: image, person: person });
var view = new Project.Views.Images.ShowView({ model: model });

我无法访问模板中的任何内容，每个字段要么是空的，要么是函数的字符串表示形式。这是我的模板：

<img width="<%= image.width %>" height="<%= image.height %>" alt="<%= image.message %>" src="<%= image.url %>" />
<p><%= image.message %></p>
<h4>by <%= person.name %></h4>

这是模板产生的输出：

<img width="" height="" alt="" src="function () {
  var base = getUrl(this.collection) || this.urlRoot || urlError();
  if (this.isNew()) return base;
  return base + (base.charAt(base.length - 1) == '/' ? '' : '/') + encodeURIComponent(this.id);
}">
<p></p>
<h4>by </h4>

我已经验证图像和追逐者都是有效的模型，如果我只将其中一个传递给视图，它可以正常工作并将该模型绑定到该视图。

我也尝试过另一种方法：

var view = new Project.Views.Images.ShowView({ model: image, person: person });

使用模板然后看起来像这样：

<img width="<%= width %>" height="<%= height %>" alt="<%= message %>" src="<%= url %>" />
<p><%= message %></p>
<h4>by <%= person.name %></h4>

但是，这会引发一个 javascript 错误，说明 person 未定义，如果我从模板中删除 person.name ，其余部分会正确显示。

我做错了什么，这些甚至是正确的方法吗？

4

2 回答 2

6

视图中的参数“模型”没有什么神奇之处，除了作为一种约定，Backbone 将其复制到视图中的“模型”属性中。 [1]

您可以将任意数量的东西传递给视图——您只需要在initialize函数中对它们做一些事情。

我会对你的第二个选择进行即兴演奏：

var view = new Project.Views.Images.ShowView({ image: image, person: person });

在您视图的初始化函数中

initialize: function(options) {
    this.image = options.image;
    this.person = options.person;
}

我不熟悉在 Backbone 中使用 EJS 模板，但通常，如果你想要一个模型的属性，你需要.get()像model.get('propertyName')

所以，在上述情况下，你会image.get('someImageProperty')改为person.get('somePersonProperty')

在您看来，不会有“模型”属性，因为您没有传入任何名为“模型”的参数。

如果您想选择首选，则需要通过以下方式引用“子对象”model.get('image').get('someImageProperty')

[1] Backbone 对“模型”的默认作用就是这样：

initialize: function(options) {
    this.model = options.model;
}

默认情况下，它对具有以下名称的任何选项执行此操作：

'model', 'collection', 'el', 'id', 'attributes', 'className', 'tagName'

于 2012-03-03T21:53:28.280 回答
0

EJS 是错误的，当将模型组合成单个视图模型时，我必须使用以下模板（注意“属性”对象）：

<img width="<%= image.attributes.width %>" height="<%= image.attributes.height %>" alt="<%= image.attributes.message %>" src="<%= image.attributes.url %>" />
<p><%= image.attributes.message %></p>
<h4>by <%= person.attributes.name %></h4>

我没有更深入地研究它，所以我不确定为什么 JSON 序列化与单个模型不同，但确实如此。当我只是将图像作为模型传入时，我可以省略属性对象，如下所示：

<%= width %>
于 2012-03-04T16:27:27.523 回答