Угловой всегда выбирает первый вариант в элементе выбора

Question

Так что это мой выбор (я не использую функцию ng-options, так как мне нужно отключить опции, и я использую угловую 1.3.x, disable by функция в 1.4 afaik)

<select class="checkout" 
     ng-model="user.deliveryTime" 
     ng-change="timeUpdate = true" 
     ng-class="{'selected' : user.deliveryTime}" > 
    <option value="" disabled selected>Delivery Slot </option> 
    <option ng-repeat = "deliveryTime in intervals" 
      ng-disabled="deliveryTime.tooLate" value="{{deliveryTime.time}}"> 
     {{deliveryTime.time}} 
    </option> 
</select> 

Вот как предварительно выбрать значение для выбора

config.deliveryTimes(function(m){ 
    $scope.intervals = m; 
    $scope.user.deliveryTime = $scope.intervals[2].time; 
}); 

config.deliveryTimes(callback) в основном делает запрос HTTP и обратно.

Даже если я явно задал значение 3-го значения массива, я всегда получаю первый вариант. Когда я жестко программирую параметры в контроллере select, он все равно не работает.

Любая помощь?

Answer 1

Удалить атрибут selected на опции по умолчанию и использовать ng-selected="user.deliveryTime === deliveryTime.time":

<select class="checkout" 
     ng-model="user.deliveryTime" 
     ng-change="timeUpdate = true" 
     ng-class="{'selected' : user.deliveryTime}" > 
    <option value="" disabled>Delivery Slot </option> 
    <option ng-repeat = "deliveryTime in intervals" 
      ng-disabled="deliveryTime.tooLate" value="{{deliveryTime.time}}" 
      ng-selected="user.deliveryTime === deliveryTime.time"> 
     {{deliveryTime.time}} 
    </option> 
</select> 

Answer 2

При использовании нг-значение вместо значения в опции, выбранный вариант связывается с опциями, установленными в нг-модели (user.deliverytime)

<select class="checkout" 
    ng-model="user.deliveryTime" 
    ng-change="timeUpdate = true" 
    ng-class="{'selected' : user.deliveryTime}" > 
<option value="" disabled>Delivery Slot </option> 
<option ng-repeat = "deliveryTime in intervals" 
     ng-disabled="deliveryTime.tooLate" ng-value="deliveryTime.time" 
     > 
    {{deliveryTime.time}} 
</option> 

http://plnkr.co/edit/8hKIXwK5i35lczWEtuCw?p=preview