Каков правильный способ выбора по значению в выпадающем меню?

Question

У меня возникает проблема с угловым и выбирая элемент из выпадающего списка и делая Угловое обновление модели.

Я искал StackOverflow, но только с частичной удачей.

Проблема заключается в том, что когда я вручную устанавливаю значение для модели, мои выпадающие файлы обновляются правильно, но сама модель не обновляется;

$scope.setSelected = function(){ 
    $scope.selected.id = 15; 
    //$scope.$apply();// $apply already in progress 
} 

Из различных ответов на StackOverflow, я обнаружил, что Угловой не знает об этом обновлении и предложил ответ запустить либо $scope.$apply() или $scope.$digest(), но и бросить $apply already in progress исключения. У меня такое чувство, что для меня это не совсем правильно, потому что не имеет смысла, что вы должны инициировать событие для выбора по значению.

Каков правильный способ выбора элемента в раскрывающемся списке по заданному значению?

Полный пример кода можно найти на https://jsfiddle.net/c2x3jvut/

При нажатии на кнопку «Выбрать dinnerman», в раскрывающемся списке обновлений исправить, но представленный модель и при нажатии кнопки «Log выбран» он показывает только выбранную модель, но с обновленным идентификатором.

Answer 1

Вы можете использовать $ filter для получения всего объекта вместо каждого свойства.

$scope.setSelected = function(){ 
    $scope.selected = $filter('filter')($scope.persons,15,'id')[0]; 
    //$scope.selected.id = 15; 
    //$scope.$apply();// $apply already in progress 
    } 

Here is the modified version

Answer 2

ng's select связывает его значение на основе его ngModel, которое неправильно обрабатывается в примере. Правильный способ изменить ссылку в ngModel, а не И.Д. выбора-х:

$scope.setSelected = function() { 
    $scope.selected = $scope.persons[1]; // yes 
    // $scope.selected.id = 15; // no 
}; 

Fiddle might have been updated, чтобы показать эффект.

Answer 3

Не уверен, что я понимаю ваш вопрос, но все-таки ...

Вы можете включить в каждой записи в раскрывающемся списке:

...ng-click="setSelected(<value>)"... 

и, конечно же, добавить параметр в функцию.

Кстати, знаете ли вы, что в примере скрипта вы выбираете ID 15 в функции setSelected?

Answer 4

Вы просто обновляете текущую модель с помощью идентификатора. Но когда вы внимательно смотрите, имя и возраст остаются такими же. Далее вам необходимо обновить весь объект, как показано ниже:

$scope.setSelected = function(){ 
    $scope.selected.id = 15; 
    $scope.selected.name = "Dinner-man"; 
    $scope.selected.age = 20; 
    } 

Или любой другой способ прямого обновления объекта.