模型不更新表單提交，使用Backbone + Stickit

Question

我試圖使用backbone.stickit庫綁定我的表單輸入到模型，但似乎無法讓模型正確更新。

KeyUp事件似乎正常工作，我可以看到的價值變化，如果我使用「開始」回調來顯示它：

bindings: { 
     '#firstName': { 
      observe: 'firstName', 
      onSet: function(val, options) { 
       $('#output').html(val); 
      } 
     } 
    } 

這裏是我的代碼（Run it on jsfiddle）：

HTML

<div id="view"> 
    <form name="form" id="form"> 
     <input id="firstName" type="text"/> 
     <input type="submit" id="submit"/> 
    </form> 
    <div id="output"></div> 
</div> 

的JavaScript

var app = { 

    Model: Backbone.Model.extend({ 
     firstName: 'test' 
    }), 

    View: Backbone.View.extend({ 
     el: "#view", 

     initialize: function(){ 
      this.model = new app.Model(); 
      this.render(); 
     }, 
     bindings: { 
      '#firstName': 'firstName' 
     },   
     render: function(){ 
      this.$el.html(this.template); 
      this.stickit(); 
     }, 
     events: { 
      "submit #form": "submitForm" 
     }, 

     submitForm: function(e) { 
      e.preventDefault(); 
      $('#output').html('output:'+this.model.firstName); 
     } 

    }) 
}; 

var view = new app.View(); 

Answer 1

獲取模型屬性的方式通常不是通過訪問屬性名稱作爲對象屬性，而是您通過this.model.firstName執行的方式。就我個人而言，我知道很少有這種實施的例子。所謂正確的方法是通過使用get方法： this.model.get("firstName")。 這將返回當前的模型值。

我通常定義getter和setter每次使用模型，所以我會做到以下幾點：

getFirstName: function(){ 
    return this.get("firstName"); 
} 

只是看起來更好，更「容易對眼睛」 :)（但完全不是必須）

這裏是你的小提琴的更新：http://jsfiddle.net/srhfvs8h/1/