AngularJS: Filter with ng-options

Question

Я могу использовать фильтры для своих опций при фильтрации всего объекта, но я хочу, чтобы фильтр применялся к свойству name, и я не могу работать. В приведенном ниже примере нет изменений в том, что отображается в элементе выбора, независимо от того, что набрано на входе. Я основывал это на ответ нашел здесь - Use filter on ng-options to change the value displayed

<input type="search" class="form-control" placeholder="Filter user groups" results="0" ng-model="searchText" /> 

<select class="form-control" 
     size="8" 
     multiple 
     ng-model="UserGroupsSelected" 
     ng-options="userGroup.Id as (userGroup.Name | filter:searchText) for userGroup in AvailableUserGroups" > 

Однако фильтр действительно работает, если у меня есть это -

ng-options="userGroup.Id as userGroup.Name for userGroup in AvailableUserGroups | filter:searchText" 

Проблема в том, что я не хочу, чтобы фильтровать по Целому объект, иначе вы можете получить кажущиеся случайными и нежелательные результаты.

Answer 1

Вы можете указать фильтр как объект, имя параметра которого равно полю поиска. Для вашей цели попробуйте поместить searchText.Name в качестве модели для поиска текста. Он должен фильтровать объект только по имени.

<input type="search" class="form-control" placeholder="Filter user groups" results="0" ng-model="searchText.Name" /> 

<select class="form-control" 
     size="8" 
     multiple 
     ng-model="UserGroupsSelected" 
     ng-options="userGroup.Id as userGroup.Name for userGroup in AvailableUserGroups | filter:searchText"> 

Answer 2

Вы можете создать свой собственный фильтр таким образом:

AvailableUserGroups|byNameInSearchText:searchText 

с этой декларацией:

myapp.filter('byNameInSearchText', function() { 
    return function(availableUserGroups,textName) { 
     if (typeof textName !== "undefined" && textName !== null) { 
      return availableUserGroups.filter(function(u) { 
       return (u.Name != null) && u.Name.indexOf(textName) !== -1; 
      }); 
     } 
     else return availableUserGroups; 
    }; 
});