我有一个具有结构的单页应用程序:
- ViewModel-RootVM(页眉、页脚、常用功能……):
- SubModelA (page1 - 模板)
- SubModelB (page2 - 模板)
我想从页眉(ViewModel-RootVM)调用在第 2 页(SubModelB)上定义的函数 fnTest。如何从 ViewModel 和 HTML 中做到这一点?这甚至可能吗?如果是这样,请帮我举个例子。我在这里有点迷路了。
我正在使用 knockoutjs v2.2.1 和 jQuery v1.9.1
ViewModel(您可以在 jsfiddle 中查看其余代码,链接如下)
var View = function(title, templateName, data) {
var self = this;
self.title = title;
self.templateName = templateName;
self.data = data;
self.myPostProcessingLogic = function(element1, index1, data1) {
console.log('post processing');
};
};
var SubModelA = function(root) {
var self = this;
self.items = ko.observableArray([
{ id: 1, name: "one" },
{ id: 2, name: "two" },
{ id: 3, name: "three" }
]);
};
var SubModelB = function(root) {
var self = this;
self.firstName = ko.observable("Bob");
self.lastName = ko.observable("Smith");
self.fnTest = function() {
alert('calling function from subModelB');
};
self.fnSubModelB = function() {
root.allert('calling function allert from root');
};
};
var ViewModel = function() {
var self = this;
self.views = ko.observableArray([
new View("one", "oneTmpl", new SubModelA(self)),
new View("two", "twoTmpl", new SubModelB(self))
]);
// default open page 'two'
self.selectedView = ko.observable(self.views()[1]);
self.allert = function() {
alert('alert from rootVM');
};
self.allert2 = function() {
// how can I call function 'fnTest' which is defined in SubModelB
self.views()[1].fnTest(); // this is not working
};
};
var viewModel = new ViewModel();
ko.applyBindings(viewModel);