javascript - Angular ui-select, ignore empty item in choices -


say have such array.

$scope.countries = [     {name: 'a'},     {name: 'b'},     {notname:'xx'}  ]; 

i want use angular ui-select form dropdown select. since third object doesn't contain 'name', should not shown.

plunker: http://plnkr.co/edit/jbfdnjzssghvnc7ty0wk?p=preview

but ui-select keeps showing small empty space. wonder how can overcome this. appreciates.

try using custom filter before search filter this:

plunkr

index.html

<body ng-controller="democtrl">   <p>selected: {{country.selected}}</p>   <ui-select ng-model="country.selected" theme="selectize" style="width: 300px;">     <ui-select-match placeholder="select or search country in list...">{{$select.selected.name}}</ui-select-match>     <ui-select-choices repeat="country in countries| removeblanks | filter: $select.search ">       <span ng-bind-html="country.name | highlight: $select.search"></span>     </ui-select-choices>   </ui-select> </body> 

app.js

'use strict';  var app = angular.module('demo', ['ngsanitize', 'ui.select']);  app.controller('democtrl', function($scope, $http) {    $scope.country = {};   $scope.countries = [     {name: 'a'},     {name: 'b'},     {notname:'xx'}   ];   $scope.ignore = {notname:'xx'}; });  app.filter('removeblanks', function() {   return function( items) {     var filtered = [];     angular.foreach(items, function(item) {       if(!item.hasownproperty('notname')){         filtered.push(item);       }     });      console.log('filtered', filtered);     return filtered;   }; }); 

Comments