使用ui选择匹配项选择多个条目

Question

我的模板中有这个：

<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>

我可以在数组中循环，select字段显示具有project_type名称的所有选项。它有效。

但当我尝试选择select的选项时，第一个数组元素的整个json元素将选择。。。（无论我选择什么选项）。

如果我选择了一个选项，我如何解决只有相应的名称会显示在选择字段中的问题？

Answer 1

您正在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>