javascript - AngularJS select2 not showing any values -

i using select2 way specified in https://github.com/angular-ui/ui-select2

<div ng-controller="samplecontroller>     <select ui-select2 ng-model="select2" data-placeholder="pick number">         <option value=""></option>         <option ng-repeat="number in range" value="{{number.value}}">{{number.text}}</option>     </select> </div> 

but not working me. see dropdown there no values select.

if change have static list follow works fine.

<div ng-controller="samplecontroller">     <select ui-select2 ng-model="select2" data-placeholder="pick number">         <option value="">value1</option>         <option value="">value2</option>         <option value="">value3</option>     </select> </div> 

what missing here?

my model follow

function samplecontroller($scope){     $scope.select2="";     $scope.range=[{text:"name1", value:"id1"},         {text:"name2", value:"id2"},         {text:"name3", value:"id3"}];      $("#e1").select2(); } 

i think have use $timeout :

function samplecontroller($scope, $timeout){     $scope.select2="";     $scope.range=[{text:"name1", value:"id1"},         {text:"name2", value:"id2"},         {text:"name3", value:"id3"}];     $timeout(function(){       $("#e1").select2();     }, 0); } 

why? because $timeout wait end of $digest (in case ng-repeat) before execute function.

your previous code did :

• render html
• $("#e1").select2();
• interpretate ng-repeat

so, select2 function executed before select has option elements.

look $timeout documentation : https://docs.angularjs.org/api/ng/service/$timeout