AngularJS select directive not working with option -
this example seems simple enough, can't seem figure out why not working (i don't want use ng-options because doesn't work select2, plugin want use once figured out):
html:
<div ng-app="myapp"> <div ng-controller="myctrl"> selectednumber: {{selectednumber}} <select ng-model="selectednumber"> <option ng-repeat="number in numbers" value="{{number}}">{{number}}</option> </select> <div ng-repeat="number in numbers"> {{number}} </div> </div> </div> angularjs:
var app = angular.module('myapp', []); app.controller('myctrl', function($scope) { $scope.numbers = [1, 2]; $scope.selectednumber = 2; }); when inspect element looks this:
<select ng-model="selectednumber" class="ng-pristine ng-valid"> <option value="? number:2 ?"></option> <!-- ngrepeat: number in numbers --> <option ng-repeat="number in numbers" value="1" class="ng-scope ng-binding">1</option> <option ng-repeat="number in numbers" value="2" class="ng-scope ng-binding">2</option> </select> i guessing "<option value="? number:2 ?"></option>" causing issue not sure how rid of it. created jsfiddle of in action.
the reason see because select bound item not contained in options. although adding options via ng-repeat suspect directive won't work , not designed work way:
here reference why value coming up. angularjs - blank option added using ng-repeat in select tag
i think have 2 options: 1. write own directive 2. use built in ng-options , try make work plugin
here reference: https://github.com/angular/angular.js/issues/639 , fiddle issue: http://jsfiddle.net/gtynf/3/
those point in right direction solution.
