0

我正在练习使用 knockout.js 连接 jQuery 自动完成功能。我正在尝试构建的应用程序是一个简单的待办事项列表。我的任务对象具有desc,name和,等属性id。它有一个setUser()设置任务名称和 ID 的方法（基本上将任务分配给某人。

我用这种方式编写了我的自定义绑定：

ko.bindingHandlers.autocomplete = {
    init: function (el, valueAccessor) {
        var va = valueAccessor();
        var lbl = va.label;
        var val = va.value;
        $(el).autocomplete({
            source: src,
            select: function (evt, ui) {
                evt.preventDefault();
                lbl(ui.item.label);
                val(ui.item.value);
                $(el).val(ui.item.label);
            }
        });
    }
};

data-bind语法编写如下：

<input type="text" data-bind="autocomplete : {label: name, value: id}"/>

所有这些都可以完美地连接自动完成。但是，以您更改模型中的某些内容为例，您自然希望关联的文本框反映更新的结果。

这里的简单解决方案是添加值绑定：

<input type="text" 
    data-bind="autocomplete : {label: name, value: id}, value: name"/>

value但是，如果没有绑定，您如何做到这一点？！

jsbin链接：http: //jsbin.com/InUHIwE/3/

4

1 回答 1

0

你只需要订阅你想要的 observable。

因此，我将重写我的自定义绑定，如下所示：

ko.bindingHandlers.autocomplete = {
    init: function (el, valueAccessor) {
        console.log('init');
        var va = valueAccessor();
        var lbl = va.label;
        var val = va.value;
        lbl.subscribe(function (v) {
            $(el).val(v);
        });
        console.log('valueaccessor:', va);
        $(el).autocomplete({
            source: src,
            select: function (evt, ui) {
                evt.preventDefault();
                lbl(ui.item.label);
                val(ui.item.value);
                $(el).val(ui.item.label);
            }
        });
    }
};

jsbin链接：http: //jsbin.com/InUHIwE/4/

于 2013-10-02T06:31:05.500 回答