javascript 从 ViewModel 外部调用 Knockout 函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/22491482/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 23:15:35  来源:igfitidea点击:

Calling Knockout function from outside ViewModel

javascriptknockout.js

提问by Mike Cole

In my specific example, there are several different widgets that have their own encapsulated ViewModel. I need a global Save button that saves each individual ViewModel. I can't seem to figure out how to call functions on the individual ViewModels.

在我的具体示例中,有几个不同的小部件都有自己封装的 ViewModel。我需要一个全局保存按钮来保存每个单独的 ViewModel。我似乎无法弄清楚如何在单个 ViewModel 上调用函数。

Example - how can I call the Save function on each ViewModel: http://jsfiddle.net/sNSh2/4/

示例 - 如何在每个 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() {

});

回答by huocp

I don't understand your problem, why not simply hold a reference of your model object?

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

$(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();
  });
});

If you really have problem to get references of all model objects (maybe defined in isolated js files), ko provided way to get context object out from associated DOM object. You can still do this:

如果您确实无法获取所有模型对象的引用(可能在独立的 js 文件中定义),ko 提供了从关联的 DOM 对象中获取上下文对象的方法。你仍然可以这样做:

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

回答by Nathan Fisher

Knockout has basic pub/sub functionality. try this on for size jsFiddle

Knockout 具有基本的发布/订阅功能。试试这个大小jsFiddle

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");
});

回答by Tuan

You just need to instantiate your ViewModel1 and ViewModel2 functions:

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

$('#save').on('click', function() {
   var vm1 = new ViewModel1(),
       vm2 = new ViewModel2();

   vm1.SayHi();
   vm2.SayHi();
});