在單個主幹視圖和EJS模板中使用多個模型的問題

Question

我試圖在單個視圖中使用兩個模型，因此模板但試圖在此問題中顯示的示例：Backbone.js: complex views combining 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錯誤說人是不確定的，如果我刪除的人。名稱來自模板，其餘顯示正確。

我做錯了什麼，這些甚至是正確的方法？

Answer 1

的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 %> 

Answer 2

對於視圖中的參數「模型」沒有什麼不可思議的，除此之外，作爲一種約定，骨幹將視圖複製到視圖中的「模型」屬性中。

你可以傳入儘可能多的東西，只要你想要一個視圖 - 你只需要在initialize函數中對它們做些什麼。

我將與即興去你的第二選擇：

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

在視圖的初始化函數

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

我不熟悉使用EJS模板和骨幹，但通常情況下，如果你想要一個模型的屬性，你需要.get()它就像model.get('propertyName')

所以，在上述情況下，你會反而做image.get('someImageProperty')和person.get('somePersonProperty')

在您的看法中，將不會有「model」屬性，因爲您沒有傳入任何名爲「model」的參數。

如果你想要去與你的第一選擇，那麼你就需要通過引用的「子對象」 model.get('image').get('someImageProperty')

[1]默認使用「模型」做什麼骨幹很簡單：

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

爲此，它會在默認情況下，對於這些名稱的任何選項：

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