Backbone.js理解：取模並顯示模板

我已經閱讀了很多教程並在.net上搜索......但仍然遇到Backbone.js的麻煩。這是我的簡單場景：Backbone.js理解：取模並顯示模板

Rails應用程序響應具有JSON對象集合的GET請求。當DOM準備就緒時，我想動態地建立一個包含Backbone集合的錶行列表。這是代碼混淆我：

HTML部分：

<script type="text/template" id="tmplt-Page"> 
     <td>{{=title}}</td> 
     <td>{{=description}}</td> 
    </script>

骨幹的腳本：

$(function(){ 
    var Page = Backbone.Model.extend({}); 

    var Pages = Backbone.Collection.extend({ 
     model: Page, 
     url: '/pages' 
    }); 
    var pages = new Pages([ 
     {title: 'ProvA1', description: ''}, 
     {title: 'ProvA2', description: ''} 
    ]); 

    var PageView = Backbone.View.extend({ 
     tagName: 'tr', 
     template: _.template($('#tmplt-Page').html()), 

     render: function() { 
      this.$el.append(this.template(this.model.toJSON())); 
      return this; 
     } 

    }); 

    var AppView = Backbone.View.extend({ 
     el: $("#results"), 

     initialize: function() { 
      _.bindAll(this, 'render'); 
      pages.on('reset', this.render) 
     }, 

     render: function() { 
      this.$el.empty(); 
      pages.each(function(page) { 

       var view = new PageView({ 
        model : page 
       }); 

       this.$el.append(view.render().el); 

      }); 

      return this; 
     } 

    }); 

    var appview = new AppView; 

});

沒有呈現在屏幕上。

似乎有爲2個問題：

1）取（）是異步的，因此該代碼的AJAX往返結束之前執行。

2）如果我手動加載某些對象到集合，這一段代碼「this.template（this.model.toJSON（））」不能代替JSON屬性

編輯：

要用鬍子標籤我寫此代碼之前所有：

enter image description here

來源

2012-11-04 Mich Dart

首先，正如你所說，fetch()是異步的，但它會觸發「復位」事件當它完成，所以你應該添加此：

pages.on('reset', this.render)

其次，你從來沒有在任何地方插入網頁瀏覽的HTML。在AppView.render補充一點：

// at the beginning var self = this; // and in the forEach loop self.$el.append(view.el);

第三，在AppView.render開始時，你應該清楚的this.$el內容。

編輯：

你仍然有幾個問題：

您正在使用下劃線與鬍子標籤模板（{{ }} - ><%= %>）
缺少變種self = this在渲染
你是不要撥打appview.render()！ :)

這裏是你的代碼上的jsfiddle工作：http://jsfiddle.net/PkuqS/

來源

2012-11-04 17:43:59

我進行了更改，請上述檢查出的代碼。但是，仍然沒有...謝謝 –

現在一切正常！謝謝。只有幾個問題：我應該在什麼時候使用backbone.js？我的意思是...當用戶可以更新DOM時非常有用......但是如果我必須在頁面加載時預加載/填充集合，這是個好主意嗎？當這個美好的圖書館變得有用？ –

Backbone.js理解：取模並顯示模板

回答

相關問題