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:
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
Post a Comment