揭示模块模式产生问题的数据不再是全球

Question

这下面是我前面正在工作的代码最小化版本..

var data = [mydata]; 
var appscope = function() { 
    function col(c) { 
     var self = this; 
     this.view = ko.observable(false); 
     this.view.subscribe(function(newValue) { 
      vm.updateCol(); 
     }); 
    } 
    var myModel = function() { 
     var self = this; 
     self.viewdata = ko.observableArray(data); 
     self.updateCol = function() { 
      console.log("updatecol called") 
     }; 
    }; 
    var vm = new myModel(); 
    ko.applyBindings(vm); 
}();  

在上面的代码vm.updatecol作品作为虚拟机是全球性的就appscope而言。此外数据是全球..

现在我试图使用暴露模块模式，改变了代码如下..

var appscope = function() { 
    var that = this; 

    function col(c) { 
     var self = this; 
     this.view = ko.observable(false); 
     this.view.subscribe(function(newValue) { 
      // vm.updateCol(); no longer works.... 
      //that.appscope.myModel().updatecol(); throws error in myModel 
     }); 
    } 
    var myModel = function(data) { 
     var self = this; 
     self.viewdata = ko.observableArray(data); 
     self.target=ko.observable(null); 
     self.target(new col([])); 
     self.updateCol = function() { 
      console.log("updatecol called") 
     }; 
    }; 
    return { 
     myModel: myModel 
    }; 
}(); 
(function(appscope) { 
    var vm = new appscope.myModel([mydata]); 
    ko.applyBindings(vm); 
})(appscope); 

在上面的代码vm.updatecol不起作用为VM是出的范围。我什至试图that.appscope.myModel（）。updatecol（），但试图重新创建myModel和数据不存在引发其他错误。

我该如何解决这个问题。 所有帮助真诚感谢。 谢谢

Answer 1

好消息！您已成功将col与myModel和vm分开。这主要是一件好事。但是，由于您仍想在col的view更改时致电updateCol，因此您确实需要以某种方式挂钩它们。

你有三个选择：

1. 创造它时

2. 交给myModel订阅col的view

3. 再访传递一个参考myModel实例为col整个结构

这对我来说就像＃3一样，但没有更多的上下文是不可能的。

的＃1示例：

var appscope = function() { 
    var that = this; 

    function col(c, model) {      // *** 
     var self = this; 
     this.view = ko.observable(false); 
     this.view.subscribe(function(newValue) { 
      model.updateCol();     // *** 
     }); 
    } 
    var myModel = function(data) { 
     var self = this; 
     self.viewdata = ko.observableArray(data); 
     self.target=ko.observable(null); 
     self.target(new col([], self));   // *** 
     self.updateCol = function() { 
      console.log("updatecol called") 
     }; 
    }; 
    return { 
     myModel: myModel 
    }; 
}(); 
(function(appscope) { 
    var vm = new appscope.myModel([mydata]); 
    ko.applyBindings(vm); 
})(appscope); 

的＃2示例：

var appscope = function() { 
    var that = this; 

    function col(c) { 
     var self = this; 
     this.view = ko.observable(false); 
     // *** Not subscribing here 
    } 
    var myModel = function(data) { 
     var self = this; 
     self.viewdata = ko.observableArray(data); 
     self.target=ko.observable(null); 
     var c = new col([]);     // *** 
     self.target(c);      // *** 
     c.view.subscribe(function(newValue) { // *** 
      self.updateCol();     // *** 
     });         // *** 
     self.updateCol = function() { 
      console.log("updatecol called") 
     }; 
    }; 
    return { 
     myModel: myModel 
    }; 
}(); 
(function(appscope) { 
    var vm = new appscope.myModel([mydata]); 
    ko.applyBindings(vm); 
})(appscope); 

这第二种方法有您做target可观察到的一个问题。如果target真的可以改变，我们需要做一些订阅管理，这也是为什么我对上述第3项精益部分：

var appscope = function() { 
    var that = this; 

    function col(c) { 
     var self = this; 
     this.view = ko.observable(false); 
     // *** Not subscribing here 
    } 
    var myModel = function(data) { 
     var viewSub;          // *** 
     var self = this; 
     self.viewdata = ko.observableArray(data); 
     self.target=ko.observable(null); 
     var c = new col([]);        // *** 
     self.target(c);          // *** 
     subScribeCol(c);         // *** 
     self.target.subscribe(function(newCol) {   // *** 
      viewSub.dispose();        // *** 
      subcribeCol();         // *** 
     });             // *** 
     self.updateCol = function() { 
      console.log("updatecol called") 
     }; 
     function subscribeCol(c) { 
      viewSub = c.view.subscribe(function(newValue) { // *** 
       self.updateCol();       // *** 
      });            // *** 
     } 
    }; 
    return { 
     myModel: myModel 
    }; 
}(); 
(function(appscope) { 
    var vm = new appscope.myModel([mydata]); 
    ko.applyBindings(vm); 
})(appscope);