下劃線模板無法訪問模型數據

我想從模板渲染視圖集合，但無法訪問視圖模板中的模型數據。如果我在模板中放置了一個<% debugger %>調用，我可以將本地作用域中的患者變量看作一個對象，並且還可以從控制檯訪問模型的屬性，例如。 patients.first_name。但我已經嘗試了模板中可以考慮的每個置換，以便訪問模型值，並且似乎無法獲取數據（即<%= patient.first_name %>,<%= patient['first_name'] %>結果爲「Can't find variable: patient」）。下劃線模板無法訪問模型數據

值得注意的是，PatientView中的點擊處理程序爲單個視圖輸出正確的「id」屬性，因此模型數據顯然會傳遞到視圖中。

 (function() { 
     Patient = Backbone.Model.extend({}); 
     PatientCollection = Backbone.Collection.extend({ 
      model: Patient 
     }); 

     PatientListView = Backbone.View.extend({ 
      tagName: "div", 

      initialize: function() { 
       _.bindAll(this, "renderPatient"); 
      }, 

      renderPatient: function (model) { 
       console.log(model); //<--object with 'attributes' property containing patient model 
       var patientView = new PatientView({model: model}); 
       patientView.render(); 
       $(this.el).append(patientView.el); 
      }, 

      render: function() { 
       this.collection.each(this.renderPatient); 
      } 
     }); 

     PatientView = Backbone.View.extend({ 
      tagName: "div", 
      events: { 
       "click button": "clicked" 
      }, 

      clicked: function (e) { 
       //e.preventDefault(); 
       var id = this.model.get("id"); 
       console.log(id); 
      }, 

      render: function() { 
       console.log(this.model.toJSON()); //<--object with all model properties 
       var template = _.template($("#patients-item-view").text()); 
       template({patient: this.model.toJSON()}); 
       $(this.el).append(template); 
      } 
     }); 

     var items = new PatientCollection(patientData.data); 

     var view = new PatientListView({collection: items}); 

     view.render(); 

     $("#patient-data").html(view.el); 
    })();

模板是很大，但縮寫現在，只有一個參考模型數據：

<script type="text/template" id="patients-item-view"> 
    <div class="container-fluid patient-data-bar"> 
     <div class="row"> 
      <div class="col-md-1"> 
       <%= patient.first_name %> 
      </div> 
</script>

運行時，患者被顯示爲未定義/不能在控制檯找到。這裏發生了什麼？

來源

2015-05-10 spaceage

_.template返回一個函數，然後用它將數據轉換爲插值字符串。在您的render方法中，您將該函數提供給jQuery.append，但它無法訪問此時的數據。

嘗試

render: function() { 
    var template = _.template($("#patients-item-view").text()); 
    var html = template({patient: this.model.toJSON()}); 
    this.$el.append(html); // views have a cached version of the element 
}

來源

2015-05-10 17:06:42 nikoshr

非常感謝您的幫助......我經過多次努力後確實發現了這個（或類似的）解決方案。我去了： – spaceage

var template = _.template（$（「＃patients-item-view」）。text（））; var vars = {patient：this.model.toJSON（）}; var html = template（vars）; this。$ el.append（html）; – spaceage

   var template = _.template($("#patients-item-view").text()); 
       var vars = { patient: this.model.toJSON() }; 
       var html = template(vars); 
       this.$el.append(html);

還曾爲原因貼在下面。

來源

2015-05-11 18:57:37 spaceage

下劃線模板無法訪問模型數據

回答

相關問題