brazorf brazorf - 1 year ago 113
AngularJS Question

Angular ngSelected not working in version > 1.3


<!DOCTYPE html>
<html ng-app="test">

<script data-require="angular.js@1.5.6" data-semver="1.5.6" src=""></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>

<body ng-controller="ctrl">
<h1>Hello Plunker!</h1>
<select ng-model="user.item_id">
<option ng-selected=" == user.item_id" ng-repeat="i in items" value={{}}>{{}}</option>



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 = $;



Problem: if you inspect the html code of the
, you will see that the HTML
attribute is properly placed.

However, it doesn't show as the highlighted option. Why?

== EDIT ==

That plunker code is working as expected on angular 1.3.20, but it's broken in 1.4.x or 1.5.x

Working plunker:

== EDIT2 ==

I've issued a ticket on angularjs queue:

Basically, they say we should stick to ngOptions, though they don't know why ngSelected got broken.

Answer Source

Well, you could use ng-options instead...

<select ng-model="user.item_id" ng-options=" as for i in items">

Check here