从ViewModel外部调用Knockout函数

Calling Knockout function from outside ViewModel

本文关键字：函数 Knockout 外部调用 ViewModel      更新时间：2023-09-26

在我的特定示例中，有几个不同的小部件具有自己封装的ViewModel。我需要一个全局保存按钮来保存每个单独的ViewModel。我似乎不知道如何在单个ViewModels上调用函数。

示例-如何在每个ViewModel上调用Save函数:http://jsfiddle.net/sNSh2/4/

var ViewModel1 = function() {
    var self = this;
    self.firstName = ko.observable('');
    self.lastName = ko.observable('');
    self.firstName('John');
    self.lastName('Doe');
    self.Save = function () {
        alert(ko.toJSON(self));
    };
};
ko.applyBindings(new ViewModel1(), document.getElementById("person"));
var ViewModel2 = function() {
    var self = this;
    self.subscriptionLevel = ko.observable('');
    self.subscriptionLevel('premier');
    self.Save = function () {
        alert(ko.toJSON(self));
    };
};
ko.applyBindings(new ViewModel2(), document.getElementById("subscription"));
$('#save').on('click', function() {
});

我不明白你的问题，为什么不简单地持有你的模型对象的引用?

$(function() {
  ...
  var m1 = new ViewModel1();
  ko.applyBindings(m1, document.getElementById("person"));
  ...
  var m2 = new ViewModel2();
  ko.applyBindings(m2, document.getElementById("subscription"));
  $('#save').on('click', function() {
    m1.Save();
    m2.Save();
  });
});

如果你真的有问题获得所有模型对象的引用(可能在孤立的js文件中定义)，ko提供了从相关的DOM对象中获取上下文对象的方法。你仍然可以这样做:

ko.contextFor(document.getElementById("person")).$data.Save();
ko.contextFor(document.getElementById("subscription")).$data.Save();

Knockout具有基本的发布/订阅功能。

var postbox = ko.observable();
var ViewModel1 = function() {
    var self = this;
    self.firstName = ko.observable('');
    self.lastName = ko.observable('');
    self.firstName('John');
    self.lastName('Doe');
    self.Save = function () {
        alert(ko.toJSON(self));
    };
    postbox.subscribe(function(newValue){
        self.Save();
    }, self, 'save');
};
ko.applyBindings(new ViewModel1(), document.getElementById("person"));
var ViewModel2 = function() {
    var self = this;
    self.subscriptionLevel = ko.observable('');
    self.subscriptionLevel('premier');
    self.Save = function () {
        alert(ko.toJSON(self));
    };
    postbox.subscribe(function(newValue){
        self.Save();
    }, self, 'save');
};
ko.applyBindings(new ViewModel2(), document.getElementById("subscription"));
$('#save').on('click', function() {
    postbox.notifySubscribers(null, "save");
});

你只需要实例化你的ViewModel1和ViewModel2函数:

$('#save').on('click', function() {
   var vm1 = new ViewModel1(),
       vm2 = new ViewModel2();
   vm1.SayHi();
   vm2.SayHi();
});
相关文章：