Handlebars not reading backbone.js模型屬性

Question

我有一些奇怪的困難，顯示模型屬性與車把和backbone.js 這裏是代碼。

MYAPP.Menu = {}; 
MYAPP.Menu.Item = Backbone.Model.extend({ 
urlRoot : 'menuItem', 
     defaults: { 
     title: "Menu Item Title default", 
     price: "menu item price default" 
     }, 
}); 

MYAPP.Menu.Items = Backbone.Collection.extend({ 
    model: MYAPP.Menu.Item, 
    url: 'menuItems' 
}); 

MYAPP.Menu.ItemView = Backbone.View.extend({ 

    initialize : function() { 
     this.model = new MYAPP.Menu.Item(); 
     this.model.on('all', this.render, this); 
    }, 
    render : function() { 
     var source = $("#index-template").html(); 
     var template = Handlebars.compile(source); 
     console.debug(this.model.get("title")); <- shows default value 
     var html = template(this.model); 
     console.debug(html); 
     this.$el.html(html); 
     return this; 
    } 
}); 

而且模板：

<script type="text/x-mustache-template" id="index-template"> 
     <div class="entry"> 
     <h1>{{title}}</h1> 
      <div class="body"> 
      {{price}} 
      </div> 
     </div>   
    </script> 

輸出無非只是任何數據的標籤。在控制檯中也沒有錯誤。 任何想法？

嗯，我有一個解決辦法：

當我使用

initialize : function() { 
     this.title = "Menu Item Title default"; 
     this.price = "menu item price default"; 
    }, 

，一切工作正常。沒有任何人有這個

Answer 1

var html = template(this.model); 

的解釋應該是

var html = template(this.model.toJSON()); 

基本上，this.model具有attributes屬性，存儲所有的，你可以檢索使用this.model.get()，並使用this.model.set()設置的信息。這些屬性不附加到基本模型。

當你有下面的代碼

initialize : function() { 
    this.title = "Menu Item Title default"; // BAD! 
    this.price = "menu item price default"; // BAD! 
} 

要附加的屬性，以示範基地。這是Backbone的不正確使用。如果您之後嘗試執行this.model.get("title")，那將是undefined。