木偶 - 使用控制器跨多个视图的数据

Question

我在弄清楚如何设置“控制器”宽数据时遇到了一些麻烦。这是我的控制器代码：

Mod.Controller = Marionette.Controller.extend({
    region: App.layout.mainRegion,

    initialize: function(){
        var self = this;

        this.layout = new SomeLayout();

        this.collection = new SomeCollection();
        $.when(this.collection.fetch()).done(function(){
            self.region.show(self.layout);  
        });
    },

    index: function(opts){
        var v = new Mod.ViewOne();
        this.layout.mainRegion.show(v);
    },

    overview: function(opts){
        var v = new Mod.ViewTwo();
        this.layout.mainRegion.show(v);
    },

    onClose: function(){
        this.layout.close();
    }
});

问题是，在集合完成提取之前调用了视图函数（索引和概述），因此布局显示为空。

我宁愿不必在每个视图函数中获取数据，因为它将不必要地访问数据库。在每个视图函数中都没有一些令人讨厌的if语句样板文件，还有其他方法可以实现吗？

Answer 1

问题是您的路线是在完全取款之前触发的。

我可以想出两种方法来解决这个问题，

选项1：在获取集合之前，不要启动路由器。

如果这是你唯一的控制器，这将有效，如果你有其他控制器，这个解决方案会变得更复杂。

initialize: function(){
    var self = this;

    this.layout = new SomeLayout();

    this.collection = new SomeCollection();
    $.when(this.collection.fetch()).done(function(){
        self.region.show(self.layout);
        Backbone.history.start();
    });
},

选项2：让您的路线知道提取呼叫

您可以存储来自collection.fetch调用的承诺，并在控制器函数中使用它。我更喜欢这种方法，因为它更灵活。

initialize: function(){
    var self = this;

    this.layout = new SomeLayout();

    this.collection = new SomeCollection();
    this.collectionPromise = this.collection.fetch();
    this.collectionPromise.done(function(){
        self.region.show(self.layout);
    });
},

index: function(opts){
    var self = this;
    this.collectionPromise.done(function(){
         var v = new Mod.ViewOne();
         self.layout.mainRegion.show(v);
    });
}