Jquery ui Knockout.js自动完成bindingHandler
我正在尝试一个Knockout.js的自动完成处理程序,我正在寻找一些反馈。这目前是可行的,但我想看看我是否可以在没有这么多Eval()的情况下完成这项工作,并且为了可重用性,看看是否有一种方法可以引用ViewModel,而不必预先假定它的名称为“vm”,如下所示 用法:Jquery ui Knockout.js自动完成bindingHandler,jquery-ui,autocomplete,knockout.js,viewmodel,Jquery Ui,Autocomplete,Knockout.js,Viewmodel,我正在尝试一个Knockout.js的自动完成处理程序,我正在寻找一些反馈。这目前是可行的,但我想看看我是否可以在没有这么多Eval()的情况下完成这项工作,并且为了可重用性,看看是否有一种方法可以引用ViewModel,而不必预先假定它的名称为“vm”,如下所示 用法: <input placeholder="Test..." type="search" data-bind="autoComplete:$root.persons, source:'/api/Person/', param
<input placeholder="Test..." type="search" data-bind="autoComplete:$root.persons, source:'/api/Person/', parameterName:'searchString', labelKey:'displayName', valueKey:'urid', onSelected:'addPerson'" autocomplete="off" />
为了获得一些灵感,我将看看Ryan Niemeyers在本文中的答案,这是我见过的最全面的自动完成绑定处理程序 另一个更简单的自动完成绑定处理程序,我的团队和我为自己的目的创建的,可以在这里找到你知道你不需要
eval()
按名称访问属性,只需执行obj[propertyName]
就可以了。。。
ko.bindingHandlers.autoComplete = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
var postUrl = allBindingsAccessor().source; // url to post to is read here
var param = allBindingsAccessor().parameterName;
var labelKeyName = allBindingsAccessor().labelKey;
var valueKeyName = allBindingsAccessor().valueKey;
var selectedFunction = allBindingsAccessor().onSelected;
var selectedObservableArrayInViewModel = valueAccessor();
$(element).autocomplete({
minLength: 2,
autoFocus: true,
source: function (request, response) {
$.ajax({
url: param != null ? postUrl : postUrl + request.term,
data: param == null ? '' : param + "=" + request.term,
dataType: "json",
type: "GET",
success: function (data) {
response($.map
(data, function (obj) {
return {
label: eval("obj." + labelKeyName),
value: eval("obj." + valueKeyName)
};
}));
}
});
},
select: function (event, ui) {
if (selectedFunction != null) {
var functionCall = 'vm.' + selectedFunction + "(event, ui)";
eval(functionCall);
}
}
});
}
};