在Knockout中初始化时调用组件功能

ksp*_*rin 5 javascript knockout.js knockout-components

使用普通的视图模型,我可以在它的上下文之外的初始化之后调用一个函数,如下所示:

var ViewModel = function () {
    this.Foo = function () {
        alert("bar");
    };
};

var vm = new ViewModel();
ko.applyBindings(vm);

vm.Foo();
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/h01ky3pv/

如何使用组件的视图模型执行此类操作?我想打电话FooComponentViewModelFoo功能,首先加载foo的组件时.

ko.components.register("foo", {
    viewModel: FooComponentViewModel,
    template: {
        element: "component-foo"
    }
});

function FooComponentViewModel(params) {
    this.Foo = function () {
        alert("bar");
    };
}

var ViewModel = function () {
    // empty
};

var vm = ViewModel();
ko.applyBindings();
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/r3d41q6c/2/

lan*_*nte 4

只是一个想法,将回调作为组件的参数传递:

HTML:

<foo params="callback: callback"></foo>
Run Code Online (Sandbox Code Playgroud)

JS:

function FooComponentViewModel(params) {
    this.Foo = function () {
        alert("bar");
    };

    params.callback(this);
}

function ViewModel() {
    this.callback = function(vm) {
        vm.Foo();
    };
}
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/r3d41q6c/3/