Question

我有一个自定义的翻译绑定：

ko.bindingHandlers.lang = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        this.lang = [
            'text1':'text1 translated'
            ,'text2':'text2 translated'
        ];
    },
    update: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var keyword = valueAccessor();
        var translatedString = this.lang[keyword];
        $(element).text(translatedString );
    }
};

我使用的是这样的：

<span data-bind="lang:'text1'"></span>

但是，我也有一个用于创建表格行格式的绑定：

ko.bindingHandlers.tableRow = {
    update : function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        $(element).html("<td>" + valueAccessor()[0] + "</td><td>" + valueAccessor()[1] + "</td>");
    }
}

我使用的是这样的：

<tr data-bind="tableRow:['text1','text2']"></tr>

问题：

现在我想结合这些绑定，这样就可以调用我的tableRow绑定：

<tr data-bind="tableRow:[lang:'text1','text2']"></tr>

上面的代码只是举例来说，实际上这些绑定还有更多的内容。

我已多次阅读文档并花了很长时间寻找解决方案，却找不到任何东西。也许是因为这不能做到？

Answer 1

您需要做的就是将值从一个bindingHandler中继或修改为您要激活的其他值。

因此，在你的tablerow处理程序中，调用init和update（在各自的函数中）：

ko.bindingHandlers.lang.init(element, valueAccessor, allBindingsAccessor, viewModel)

当然需要根据需要修改参数。您可能会从数组中获取其中一个值，并将其作为第二个参数传递给init和update。

这也是激活其他标准内置绑定的好方法。

更新：添加@Joche的评论只是为了让它更具可读性：

var value = valueAccessor(); 
var newValueAccessor = function() {
    return translatedString; }; 
ko.bindingHandlers.lang.init(element, newValueAccessor,
       allBindingsAccessor, viewModel);

Answer 2

你能不能只使你的翻译成为正常的功能，然后从你的表行绑定中调用它？

var translate = function(text)
{
        this.lang = [
            'text1':'text1 translated'
            ,'text2':'text2 translated'
        ];
    },
        var translatedString = this.lang[text];
        return translatedString;
    }
};

然后，您可以将额外的参数传递给tableRow方法，以指示您是否要翻译：

然后您可以在表行绑定函数中调用它：

ko.bindingHandlers.tableRow = {
    update : function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var text1 = valueAccessor()[2] ? translate(valueAccessor()[0]) : valueAccessor()[0];
        var text2 = valueAccessor()[2] ? translate(valueAccessor()[1]) : valueAccessor()[1];
        $(element).html("<td>" + text1 + "</td><td>" + text2 + "</td>");
    }
}

然后你可以直接从绑定元素中调用它：

<span data-bind="text: translate(text1())"></span>

我可以创建一个在knockout.js中使用其他绑定的自定义绑定

问题：

2 个答案: