通过原型访问viewModel函数 [英] Accessing viewModel functions by prototype

问题描述

我试图为我的viewModel创建一个通用的容器，所以常用的方法可以应用于各种对象，而不需要viewModel的具体知识。容器和包含对象如下所示：

  var containedViewModel = function（）{
 var self = this; 
 self.id = ko.observable（）; 
 ... 
 self.doSomething = function（）{
 alert（'here'）; 
}; 
 
 
 
 var ContainerModel = function（cRoot，cModel，cName）{
 var self = this; 
 
 self.rootModel = cRoot; //根视图模型
 self.viewName = cName; // viewModel容器名称
 self.refModel = cModel; // viewModel reference 
 self.viewModel = ko.observable（）; //单视图模型
 self.viewModels = ko.observableArray（）; //视图模型阵列
 
 self.init = function（rootModel）{
 self.viewModel = new self.refModel（）; 
} 
 self.doSomething = function（）{
 self.rootModel.doSomeThing（）; //这个工程
 self.refModel.doSomeThing（）; //这不起作用
 self.viewModel.doSomeThing（）; //这不行的
} 
  

}

容器将被创建，如下所示：

  var ParnentModel = function（）{ 
 var self = this; 
 self.id = ko.observable（）; 
 ... 
 self.container = new ContainerModel（self，containedViewModel，'modelName'）; 
 ... 
 self.doSomething = function（）{
 alert（'here'）; 
}; 
}; 
  

在这个例子中，rootModel函数访问工作正常，因为实际的viewmodel被创建并传递给容器。使用'new self.refModel（）'和'self.rootModel.doSomeThing（）'似乎按预期工作。当我尝试使用'self.viewModel.doSomeThing（）;'knockout抱怨说它不是一个函数。

是否可以通过引用访问viewModels函数viewModel。

任何帮助将不胜感激。

解决方案

你快到了。

  var containedViewModel = function（）{
 var self = this; 
 self.id = ko.observable（）; 
 self.doSomething = function（）{
 alert（'contained'）; 
}; 
 //我宁愿在这里返回自己
}; 
 
 var ContainerModel = function（cRoot，cModel，cName）{
 var self = this; 
 
 self.rootModel = cRoot; //根视图模型
 self.viewName = cName; // viewModel容器名称
 self.refModel = cModel; // viewModel reference 
 self.viewModel = ko.observable（）; //单视图模型
 self.viewModels = ko.observableArray（）; //视图模型数组
 
 self.init = function（rootModel）{
 //你的意思是，对吧？ 
 self.viewModel（new self.refModel（））; 
}; 
 self.doSomething = function（）{
 self.rootModel.doSomething（）; //这个工程
 //self.refModel.doSomeThing（）; //这不起作用
 //需要解开该值，修正打字错误
 self.viewModel（）。doSomething（）; //这不起作用
}; 
}; 
 
 var ParnentModel = function（）{
 var self = this; 
 self.id = ko.observable（）; 
 self.container = new ContainerModel（self，containedViewModel，'modelName'）; 
 //缺少对init 
的调用self.container.init（）; 
 self.doSomething = function（）{
 alert（'parent'）; 
}; 
}; 
 
 //执行
 var p = new ParnentModel（）; 
 p.container.doSomething（）; 
  

http://jsbin.com/arezew/1/edit

I am attempting to create a generic Container for my viewModels so common methods can be applied a variety of objects without specific knowledge ot the viewModel. The container and contained object would look like this:

var containedViewModel = function() {
  var self = this;
  self.id = ko.observable();
    ...
  self.doSomething = function() {
  alert('here');
  };

}

var ContainerModel = function(cRoot, cModel, cName) {
  var self = this;

  self.rootModel  = cRoot;                       // Root view model
  self.viewName   = cName;                       // viewModel container name
  self.refModel   = cModel;                      // viewModel reference
  self.viewModel  = ko.observable();             // Single view model
  self.viewModels = ko.observableArray();        // Array of view models

  self.init = function(rootModel) {
    self.viewModel = new self.refModel();
  } 
  self.doSomething = function() {
    self.rootModel.doSomeThing();    // This works
    self.refModel.doSomeThing();     // This does not work
    self.viewModel.doSomeThing();    // This does not work as well
  } 

}

And the container would be created with a call like:

var ParnentModel = function() {
  var self = this;
  self.id = ko.observable();
    ...
  self.container = new ContainerModel(self, containedViewModel, 'modelName');
    ...
  self.doSomething = function() {
  alert('here');
  };
};

In this example the rootModel function access works fine because the actual viewmodel is created and passed to the container. Using 'new self.refModel()' and 'self.rootModel.doSomeThing()' appear to work as expected. When I attempt to use 'self.viewModel.doSomeThing();' knockout complains that it is not a function.

Is it possible to access a viewModels functions by reference to the viewModel.

Any help would be appreciated.

解决方案

You're almost there. See my comments inside the code.

var containedViewModel = function() {
  var self = this;
  self.id = ko.observable();
  self.doSomething = function() {
    alert('contained');
  };
  // I would prefer to have return self here
};

var ContainerModel = function(cRoot, cModel, cName) {
  var self = this;

  self.rootModel  = cRoot;                       // Root view model
  self.viewName   = cName;                       // viewModel container name
  self.refModel   = cModel;                      // viewModel reference
  self.viewModel  = ko.observable();             // Single view model
  self.viewModels = ko.observableArray();        // Array of view models

  self.init = function(rootModel) {
    // you meant this, right?
    self.viewModel(new self.refModel());
  }; 
  self.doSomething = function() {
    self.rootModel.doSomething();    // This works
    //self.refModel.doSomeThing();     // This does not work
    // need to unwrap the value, fixed typo
    self.viewModel().doSomething();    // This does not work as well
  };
};

var ParnentModel = function() {
  var self = this;
  self.id = ko.observable();
  self.container = new ContainerModel(self, containedViewModel, 'modelName');
  // missing call to init
  self.container.init();
  self.doSomething = function() {
      alert('parent');
  };
};

// execution
var p = new ParnentModel();
p.container.doSomething();

http://jsbin.com/arezew/1/edit

这篇关于通过原型访问viewModel函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！