Question

我需要传递模板简单整数。

<div data-bind="template: { name: 'TemplateName', data: 1 }">

我有淘汰赛模板：

<script type="text/html" id="TemplateName">
    <input type="button" value="val" data-bind="click: $root.stop.bind($data, @@WHAT_IS_IT@@)"/>
</script>

我想要

<script type="text/html" id="TemplateName">
    <input type="button" value="val" data-bind="click: $root.stop.bind($data, 1)"/>
</script>

我该怎么做？

Answer 1

我遇到了类似的问题，想要重复使用相同的模板，除了1个属性。为了解决这个问题，我创建了一个新的模板绑定，它允许我扩展当前已知的上下文模型模型。

ko.bindingHandlers.templateWithContext = {
    init: ko.bindingHandlers.template.init,
    update: function (element, valueAccessor, allBindings, data, context) {
        var options = ko.utils.unwrapObservable(valueAccessor());

        ko.utils.extend(context, options.context);

        return ko.bindingHandlers.template.update.apply(this, arguments);
    }
};
ko.virtualElements.allowedBindings.templateWithContext = true;

这允许在调用名为“context”的绑定时添加新参数。在此上下文参数中，您可以创建一个对象，此对象中的所有属性都是公开给模板的属性。

我比使用'data'参数更喜欢这种方法，因为这扩展了$ data模型，而不是完全替换它。

您可以使用它：

<div data-bind="templateWithContext: { name: 'TemplateName', context: { foo: 1 } }">

使用您的模板：

<script type="text/html" id="TemplateName">
    <input type="button" value="val" data-bind="click: $root.stop.bind($data, foo() )"/>
</script>

淘汰赛模板。传递简单数据

1 个答案: