自定义敲除组件

Question

是否可以在自定义敲除组件中使用条件逻辑？目标是根据提供给敲除组件的特定参数呈现不同的模板。

举一个非常简单的例子:

ko.components.register('network', {
    viewModel : function(params) {
        var someParam = params.someDeterminer;
    },
    template : render different template entirely (maybe loaded from external file) based on the value of someParam
}

这可能吗？

更新：

我接受的解决方案几乎有效。我发现 knockout 寻找模板的第一个声明。之后，您将无法更新模板。对他的代码稍加修改就可以了。像这样：

ko.components.register('network', {
    viewModel : function(params) {
        var self = this;
        var someParam = params.someDeterminer;


        if(someParam=="somecondition")
            this.templateToLoad("someTemplate")
        else 
            this.templateToLoad("someOtherTemplateToLoad")

    },
template : '<div data-bind="template:{name: templateToLoad}"></div>'
}

Answer 1

您可以有一个分支到不同组件的组件。它会将视图模型转发到正确的组件中。

<!-- ko if: someParam === 'templateA' -->
    <componentA params="viewModel: $component"></componentA>
<!-- /ko -->
<!-- ko if: someParam === 'templateB' -->
    <componentB params="viewModel: $component"></componentB>
<!-- /ko -->

Answer 2

你可以这样做

ko.components.register('network', {
    viewModel : function(params) {
        var self = this;
        var someParam = params.someDeterminer;
        self.templateToLoad = ko.observable();

        if(someParam=="somecondition")
            self.templateToLoad("someTemplate")
        else self.templateToLoad("someOtherTemplateToLoad")

    },
    template : '<div data-bind="template:{name: templateToLoad}"></div>'
}

自定义敲除组件

Custom knockout component

templates

components

knockout.js