在骨幹路由器中使用初始化函數

我正在使用Node/express和Mongodb創建我的第一個骨幹應用程序。該應用程序是一個在線食品菜單和訂購系統，可在首頁加載時從mongo收集所有數據並將其推送到Backbone集合中。我在骨幹路由器中使用初始化函數來獲取（）數據並將其放入集合中。我的問題是，在初始化函數完成之前，索引路由器正在加載。我已經確認初始化函數能夠正確運行，因爲我可以在瀏覽器控制檯中訪問該集合。在骨幹路由器中使用初始化函數

我可能要對這個錯誤的方式，但這裏是我的路由器的一個簡化版本：

GDB.Router = Backbone.Router.extend ({ 
    routes: { 
     '': 'index', 
     'drinks': 'drinks' 
    }, 

    meals: {}, 

    initialize: function() { 
     meals = new GDB.Collections.Meals 
     meals.fetch(); 
    }, 

    index: function() { 
      var mealsView = new GDB.Views.Meals ({collection: meals}); 
      $('#GDBContainer').append(mealsView.render().el);   
    }, 

    drinks: function() { 
      var drinksView = new GDB.Views.Meals ({collection: meals.byCategory('drinks')}); 
      $('#GDBContainer').append(drinksView.render().el); 
    } 
});

來源

2013-04-17 James Billings

最有可能的initialize功能已經的index函數之前完成被調用，但你的fetch是異步的，因此當您嘗試渲染您的mealsView時，集合未完成加載。

GDB.Router = Backbone.Router.extend ({ 
    routes: { 
     '': 'index', 
     'drinks': 'drinks' 
    }, 

    initialize: function() { 
     this.meals = new GDB.Collections.Meals 
     // fetch returns a jquery promise 
     this.fetchingMeals = this.meals.fetch(); 
    }, 

    index: function() { 
      var self = this; 
      // maybe show loading spinner here 
      $('#GDBContainer').html('<div>Loading</div>'); 

      this.fetchingMeals.done(function(){ 
       // now this.meals is done fetching! 
       var mealsView = new GDB.Views.Meals ({collection: self.meals}); 
       $('#GDBContainer').html(mealsView.render().el); 
      });   
    }, 

    drinks: function() { 
      var self = this; 
      // maybe show loading spinner here 
      $('#GDBContainer').html('<div>Loading</div>'); 

      this.fetchingMeals.done(function(){ 
       var drinksView = new GDB.Views.Meals ({collection: self.meals.byCategory('drinks')}); 
       $('#GDBContainer').html(drinksView.render().el); 
      }); 
    } 
});

來源

2013-04-17 06:01:37

我有一個類似的解決方案，但我把fetch方法放在每個路由器方法中。問題在於，當我已經擁有我需要的所有內容時，就會發出ajax請求，並且每次更改路由時都會重新填充集合，這會影響集合的目的。我希望Backbone會延遲任何路由器方法的啓動，直到initialize方法及其內部的任何內容完成執行。謝謝您的幫助！ –

您可以使用Paul的解決方案，或者收聽視圖中收藏的添加/重置/任何事件。

view.listenTo(model, 'reset', view.render);

來源

2013-04-17 06:12:46 yujingz

在骨幹路由器中使用初始化函數

回答

相關問題