Как динамически установить значение для выбора Angularjs?

Question

В Angularjs я пытаюсь установить опцию динамически из программы. Но я не могу установить.

Пожалуйста, поддержите.

Проверьте ссылку на комментарий для более подробной информации.

Заранее спасибо!

<div ng-app="myApp">
    <div ng-controller="AppCtrl">
        "AngularJS select example"
        <br />
         <br />
        <select ng-model="mail_notification" ng-change="plotRulegraph()">
           <option ng-selected="{{ option.key == mail_notification }}"
                   ng-repeat="option in mail_notifications"
                   value="{{option.key}}">
             {{option.value}}
           </option>
        </select>
        <br />                
    </div>
</div>

app.controller('AppCtrl', function($scope){
    $scope.mail_notifications = [
        {
            "key": 0,
            "value": "For any event on all my projects"
        },
        {
            "key":1,
            "value": "For any event on the selected projects only..."
        },
        {
            "key": 2,
            "value": "Only for things I watch or I'm involved in"
        },
        {
            "key": 3,
            "value": "Only for things I am assigned to"
        }
    ];
    $scope.mail_notification = 3;

     $scope.plotRulegraph = function() {
            $scope.mail_notification=2;
     }
});

Answer 1

Не используйте ng-selected с ng-model.

Если значения имеют тип, отличный от строки, используйте директиву ng-value:

<div ng-app="myApp">
    <div ng-controller="AppCtrl">
        "AngularJS select example"
        <br />
         <br />
        <select ng-model="mail_notification" ng-change="plotRulegraph()">
           <option ̶n̶g̶-̶s̶e̶l̶e̶c̶t̶e̶d̶=̶"̶{̶{̶ ̶o̶p̶t̶i̶o̶n̶.̶k̶e̶y̶ ̶=̶=̶ ̶m̶a̶i̶l̶_̶n̶o̶t̶i̶f̶i̶c̶a̶t̶i̶o̶n̶ ̶}̶}̶"
                   ng-repeat="option in mail_notifications"
                   ̶v̶a̶l̶u̶e̶=̶"̶{̶{̶o̶p̶t̶i̶o̶n̶.̶k̶e̶y̶}̶}̶"̶
                   ng-value="option.key">
             {{option.value}}
           </option>
        </select>
        <br />                
    </div>
</div>

С интерполяцией сдвойные фигурные скобки {{ }}, значения преобразуются в строки.Директива <select> использует строгое равенство при сравнении значений.Цифровые ключи не равны строковым ключам.Директива ng-value сохраняет правильный тип.

Из документов:

Примечание: ngSelected не взаимодействует с директивами <select> и ngModel, он только устанавливает выбранный атрибут для элемента.Если вы используете ngModel на <select>, вам не следует использовать ngSelected на опциях, так как ngModel установит значение <select> и выбранные опции.

- AngularJS ng-selected Директива API Reference

Для получения дополнительной информации см.

• AngularJS ng-value Директива API Reference
• AngularJS <select> API - Использование ngValue для привязки модели к массиву объектов

---

Обновление

Примертребуется AngularJS V1.5 или выше.

DEMO на PLNKR .