如何将下拉列表正确绑定到控制器变量,而是使用下拉数组的 id 属性而不是分配值的值,仍然使用数组的 name 属性显示下拉内容供最终用户选择?
AngularJS 工作下拉模板,但没有 ID/Value 属性
<ui-select ng-model="ctrl.risk.owner" theme="select2"
ng-disabled="ctrl.disabled" style="max-width: 150px"
title="Choose a person">
<ui-select-match placeholder="Select/Search User">
{{$select.selected.name}}
</ui-select-match>
<ui-select-choices repeat="user in ctrl.users | propsFilter: {name: $select.search}">
<div value="user.id" ng-bind-html="user.name | highlight: $select.search"></div>
</ui-select-choices>
</ui-select>
设置数组(这是我在 select-ui 下拉库中需要 user.id 的地方)
$http.get('api/users').then(function(response){
if (response.data.Succeeded){
for (var key = 0; key < response.data.Result.length; key++){
user = response.data.Result[key];
$scope.ctrl.users[user.id] = {name: user.name};
}
$scope.ctrl.userDone = true;
return response.data.Result;
}
else{
$scope.ctrl.msg += "<br />"+
$sce.trustAsHtml(response.data);
}
});
ui-select 不使用 value HTML 属性,因此没有意义。您的选择由您在重复语句中指定的内容指示。
该语句表示用户将用于绑定:
<ui-select-choices repeat="user in ctrl.users | propsFilter: {name: $select.search}">
此语句意味着用户 ID 将用于绑定:
<ui-select-choices repeat="user.id as (id, user) in ctrl.users | propsFilter: {name: $select.search}">
通常, ng-model 对象将获得您指定的绑定内容。我认为让用户进入 没有问题ctrl.risk.owner
,但您必须在代码中期待它,然后可以根据需要获取 user.id。我认为您正在尝试访问此行中选定的 ID:
$scope.ctrl.users[user.id] = {name: user.name};
如果这是真的,您应该只是查看ctrl.risk.owner
所选用户。
使用 ui-select 提供的示例。我认为这与您最接近的尝试相匹配:http : //plnkr.co/edit/?p=preview
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句