我的模板中有这个:
<ui-select multiple ng-model="selectedProjectTypes" theme="select2" style="min-width: 200px;">
<ui-select-match placeholder="Select Typ...">
[[selectedProjectTypes]]
</ui-select-match>
<ui-select-choices repeat="project_type in project_types">
<div>[[project_type.name]]</div>
</ui-select-choices>
我的[[selectedProjectTypes]]
包含选定的值。
当我打开表格时,里面什么也没有。
(API 返回相关条目。- 这有效)
project_types
包含以下内容:
[{"id":4,"slug":"event","active":1,"name":"Event","description":"","created_by":0,"updated_by":0,"created_at":"2015-12-22 09:49:43","updated_at":"2015-12-22 09:49:43","deleted_at":null},{"id":5,"slug":"sfsfsfsfsfsfsfsfsfsf","active":1,"name":"sfsfsfsfsfsfsfsfsfsf","description":"","created_by":0,"updated_by":0,"created_at":"2015-12-22 09:50:23","updated_at":"2015-12-22 09:50:23","deleted_at":null},{"id":6,"slug":"eteett","active":1,"name":"eteett","description":"","created_by":0,"updated_by":0,"created_at":"2015-12-22 10:07:55","updated_at":"2015-12-22 10:07:55","deleted_at":null},{"id":7,"slug":"sfssfsf","active":1,"name":"sfssfsf","description":"","created_by":0,"updated_by":0,"created_at":"2015-12-22 12:36:37","updated_at":"2015-12-22 12:36:37","deleted_at":null}]
这是一个 json 对象数组。这是由 api 填充的。 有了这个:
<ui-select-choices repeat="project_type in project_types">
<div>[[project_type.name]]</div>
</ui-select-choices>
我可以循环遍历数组,选择字段显示带有project_type名称的所有选项。它有效。
但是当我尝试选择 select 的选项时,第一个数组元素的整个 json 元素将被选择...(无论我选择什么选项)。
如何解决选择选项时选择字段中仅显示相应名称的问题?
最佳答案
您正在 ui-select-choices 指令中选择整个对象。请尝试以下代码:
$scope.project_type = {};
<p>Selected: {{project_type.selected}}</p>
<ui-select ng-model="project_type.selected" theme="select2" style="min-width: 300px;">
<ui-select-match>{{$select.selected.name}}</ui-select-match>
<ui-select-choices repeat="project_type.name as project_type in project_types ">
<div ng-bind-html="project_type.name"></div>
</ui-select-choices>
</ui-select>
关于javascript - 使用 ui-select-match 选择多个条目,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34592304/