Angular user interface does not display

Question

I am currently using ui-select ( https://github.com/angular-ui/ui-select ) for dropdown menus. I have included select.js and select.css in my index.html file. I also installed angular -sanitize through the gazebo.

Here is what my controller looks like:

use strict'; angular.module('myApp.home', [ 'ui.select', 'ngSanitize']).controller('ScheduleCtrl', ScheduleCtrl); ScheduleCtrl['$inject'] = [ '$stateParams', '$state' ]; function ScheduleCtrl($stateParams, $state) { var vm=this; vm.itemArray = [ {id: 1, name: 'first'}, {id: 2, name: 'second'}, {id: 3, name: 'third'}, {id: 4, name: 'fourth'}, {id: 5, name: 'fifth'}, ]; vm.scheduleEvents = [{ id:1, name:'Event1' }, { id:2, name:'Event2' }]; } 

And my view contains:

 <ui-select ng-model="selectedItem"> <ui-select-match> <span ng-bind="$select.selected.name"></span> </ui-select-match> <ui-select-choices repeat="item in (vm.itemArray | filter: $select.search) track by item.id"> <span ng-bind="item.name"></span> </ui-select-choices> </ui-select> 

However, my view is empty, and it does not seem to fall into the ui-select directive.

Answer 1

Remove ( ) .

 <ui-select-choices repeat="item in vm.itemArray | filter: $select.search track by item.id"> <span ng-bind="item.name"></span> </ui-select-choices> 

See how plunker works.

Another thing you can check out is comment on this line:

 //ScheduleCtrl['$inject'] = [ '$stateParams', '$state' ]; 

I did not understand what he was doing, but the plunker example did not work with him.