主干 - 在渲染视图之前执行多个获取（）（）

Question

我在想这里最好的模式/方法。这是我的路由器中的一个功能，所以用户点击'quotes /：id'，但为了呈现该视图，我需要他们的项目，客户和货币的列表。尝试实例化quotesEdit视图之前，确保全部3次抓取（）都已发生的最佳方法是什么？在用户点击某些内容时抓取所有信息被认为是不好的做法？

quotesEdit: function(id) { 
     kf.Collections.quotes = kf.Collections.quotes || new kf.Collections.Quotes(); 
     kf.Collections.projects = kf.Collections.projects || new kf.Collections.Projects(); 
     kf.Collections.currencies = kf.Collections.currencies || new kf.Collections.Currencies(); 
     //do a fetch() for the 3 above 
     kf.Collections.customers = kf.Collections.customers || new kf.Collections.Customers(); 
     var quote = kf.Collections.quotes.where({Id: parseInt(id, 10)}); 
     kf.Utils.ViewManager.swap('sectionPrimary', new kf.Views.section({ 
      section: 'quotesEdit', 
      model: quote[0] 
     })); 
    } 

Answer 1

我找到jQuery deferreds和组合下划线的invoke方法解决了这个优雅：

//call fetch on the three collections, and keep their promises 
var complete = _.invoke([quotes, projects, currencies], 'fetch'); 

//when all of them are complete... 
$.when.apply($, complete).done(function() { 
    //all ready and good to go... 
}); 

Answer 2

承诺！具体jQuery.when

你可以做这样的事情：

$.when(
    kf.Collections.quotes.fetch(), 
    kf.Collections.projects.fetch(), 
    kf.Collections.currencies.fetch() 
).then(function(){ 
    // render your view. 
}); 

jQuery.ajax（通过扩展骨干读取）返回一个承诺，你可以使用$.when设置一个回调函数，一旦多个承诺得到解决。

Answer 3

Backbone的fetch返回一个jQuery Deferred对象（承诺）。所以，你可以使用jQuery的when function等待所有的承诺来解决：

quotesEdit: function(id) { 
    kf.Collections.quotes = kf.Collections.quotes || new kf.Collections.Quotes(); 
    kf.Collections.projects = kf.Collections.projects || new kf.Collections.Projects(); 
    kf.Collections.currencies = kf.Collections.currencies || new kf.Collections.Currencies(); 

    //do a fetch() for the 3 above 
    var quotePromise = kf.Collections.quotes.fetch(); 
    var projectsPromise = kf.Collections.projects.fetch(); 
    var currenciesPromise = kf.collections.currencies.fetch(); 

    // wait for them to all return 
    $.when(quotePromise, projectsPromise, currenciesPromise).then(function(){ 

    // do stuff here, now that all three have resolved/returned 

    kf.Collections.customers = kf.Collections.customers || new kf.Collections.Customers(); 
    var quote = kf.Collections.quotes.where({Id: parseInt(id, 10)}); 
    kf.Utils.ViewManager.swap('sectionPrimary', new kf.Views.section({ 
     section: 'quotesEdit', 
     model: quote[0] 
    })); 

    }; 

} 

我已经写了一些关于承诺和jQuery的时候，在这里：

http://lostechies.com/derickbailey/2012/03/27/providing-synchronous-asynchronous-flexibility-with-jquery-when/

http://lostechies.com/derickbailey/2012/07/19/want-to-build-win8winjs-apps-you-need-to-understand-promises/

第二个链接仍然有效，尽管主要的主题是Win8 JS