使用Durandal JS自动完成文本框

如何使用durandal JS创建自动完成文本框。 鉴于代码不起作用。

视图模型（JS）

define(['repositories/customerRepository', 'plugins/router', 'plugins/http', 'durandal/app', 'knockout'], function (customerRepository, router, http, app, ko) { return { router: router, activate: function () { var data = customerRepository.listMovies(); $(function () { $("#movie").autocomplete({ source: data, focus: function (event, ui) { $("#movie").val(ui.item.name); return false; }, select: function (event, ui) { $("#movie").val(ui.item.name); // $("#friend-id").val(ui.item.id); return false; } }) .data("ui-autocomplete")._renderItem = function (ul, item) { return $("
") .append( "" + "
" + item.name + "
" + item.barcode + "
") .appendTo(ul); }; }); }, }; 

}）;

视图（HTML）

Answer 1

一个好的起点是从激活中删除你的逻辑并将其添加到附加的方法（假设你使用的是Durandal 2.0）如果不是，你会将它添加到viewAttached。 当DOM准备就绪时会触发这个，所以你不需要将它包装在$（function（）{}）中;

尝试一下，看看你的jquery ui auto complete是否正确绑定。

我个人更喜欢使用Select2 ，然后为它创建一个ko自定义绑定。

希望这能让你朝着正确的方向前进！

Answer 2

Durandal是一个旨在处理许多事情的JavaScript框架，但它的主要目的不是创建UI元素。

使用Durandal，您可以使用Knockout创建声明性双向数据绑定，这些绑定可以提供控件，例如自动填充文本框。 您最好的选择是研究如何使用Knockout创建自动完成文本框或下拉列表。

Google就此主题提供了许多结果

 'autocomplete textbox knockout'