Question
ui-select filtering only one field
I'm working on an AngularJS application and I'm using ui-select to allow users to select multiple roles and tabs. The filtering works perfectly for the tabs, but for some reason, it's not working for the roles, even though both are retrieved from the backend and have the same structure.
<div class="form-group">
<label>{{'CONFIG_DEPARTMENTS_ADDDEPARTMENT_ROLE' | translate}}</label>
<ui-select multiple ng-model="model.Roles" theme="bootstrap" uib-tooltip="{{'TOOLTIP_GLOBAL_ADD_ROLE' | translate}}" uis-open-close="getDepartmentRoles()">
<ui-select-match placeholder="{{'CONFIG_DEPARTMENTS_ADDDEPARTMENT_SEARCHROLE' | translate}}">{{$item.Title}}</ui-select-match>
<ui-select-choices repeat="role in roles | filter: $select.search">
<div>{{role.Title}}</div>
</ui-select-choices>
</ui-select>
<div ng-if="model.Errors.Roles">
{{model.Errors.Roles}}
</div>
And here's the code for the tabs, which works fine:
<div class="form-group">
<label>{{'CONFIG_DEPARTMENTS_ADDDEPARTMENT_TABS' | translate}}</label>
<ui-select multiple ng-model="model.Tabs" theme="bootstrap" uib-tooltip="{{'TOOLTIP_GLOBAL_ADD_TAB' | translate}}" uis-open-close="getDepartmentTabs()">
<ui-select-match placeholder="{{'CONFIG_DEPARTMENTS_ADDDEPARTMENT_SEARCHTABS' | translate}}">{{$item.Title}}</ui-select-match>
<ui-select-choices repeat="tab in tabs | filter: $select.search">
<div>{{tab.Title}}</div>
</ui-select-choices>
</ui-select>
<div ng-if="model.Errors.Tabs">
{{model.Errors.Tabs}}
</div>
For roles, I tried to filter using the following approach, but it didn't work:
filter: {name: $select.search.Title}
Also changed the attribute for one of the lists to make a dinstinct roleTitle, and just Title, did not work.
seen from: Angular ui-select filtering only one field, did not work
filter:
- ui-select
- http://github.com/angular-ui/ui-select
- Version: 0.19.7 - 2017-04-15T14:28:36.649Z