Разметка:
<!DOCTYPE html>
<html ng-app="test">
<head>
<script data-require="[email protected]" data-semver="1.5.6" src="https://code.angularjs.org/1.5.6/angular.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller="ctrl">
<h1>Hello Plunker!</h1>
<select ng-model="user.item_id">
<option ng-selected="i.id == user.item_id" ng-repeat="i in items" value={{i.id}}>{{i.name}}</option>
</select>
</body>
</html>
JS:
var module = angular.module("test", []);
module.controller('ctrl', function($scope){
$scope.items = [
{id: 1, name: 'foo'},
{id: 2, name: 'bar'},
{id: 3, name: 'baz'},
];
$scope.user = {};
$scope.selectedItem = {id: 1};
$scope.user.item_id = $scope.selectedItem.id;
});
Plunker: https://plnkr.co/edit/7oi4KwzMhGi3kdltSklg?p=preview
Проблема: если вы проверите код html select
, вы увидите, что selected
HTML-атрибут правильно помещен.
Однако он не отображается как выделенный параметр. Зачем?
== EDIT ==
Этот код плунжера работает как ожидается на угловом 1.3.20, но он сломан в 1.4.x или 1.5.x
Рабочий плункер: https://plnkr.co/edit/0ApQeZ6Kar2yQisELXfT?p=preview
== EDIT2 ==
Я отправил билет в очередь angularjs: https://github.com/angular/angular.js/issues/14876#issuecomment-231010972
В основном, они говорят, что мы должны придерживаться ngOptions, хотя они не знают, почему ngSelected получил нарушение.
Ну, вы можете использовать ng-options вместо этого...
<select ng-model="user.item_id" ng-options="i.id as i.name for i in items">
</select>
Проверьте здесь https://plnkr.co/edit/G4Hu4ZpShaUPCE5zTsdV
Я не вижу, чтобы это работало над любой версией, которую вы упоминаете. В любом случае, проверьте этот плункер
https://plnkr.co/edit/V0ybr70kRpkcaxLKBHTK?p=preview
Способ, которым вы написали select, я могу воспроизвести одно и то же на любом входе. И причина в том, что это не так, как работает угловая привязка, ваш выбор ничего не знает о его модели, если вы не измените модель (т. ng-init
помощью ng-init
).
Используя этот способ:
<option ng-selected="i.id == user.item_id" ng-repeat="i in items" value={{i.id}}>{{i.name}}</option>
не означает, что ваша модель будет обновляться, она обновляет только элемент dom.