javascript - not - directivas angularjs
seleccione por valor predeterminado para que el menĂº desplegable no funcione usando ''track by'' en angualrjs (2)
Esto funcionará:
<select name="mySelect" id="mySelect" ng-options="option.name for option in data.availableOptions track by option.id" ng-model="data.selectedOption"></select>
$scope.data = { availableOptions: [ {id: 1, name: ''Option A''}, {id: 2, name: ''Option B''}, {id: 3, name: ''Option C''} ], selectedOption: {id: 2, name: ''Option B''} };
Estoy usando track by
para evitar valores extraños ::string
que se agregan al value
pero cuando selecciono el menú desplegable predeterminado, el menú desplegable no se selecciona ... este es mi plunker
(function(angular) {
''use strict'';
angular.module(''defaultValueSelect'', [])
.controller(''ExampleController'', [''$scope'', function($scope) {
$scope.data = {
availableOptions: [
{id: ''1'', name: ''Option A''},
{id: ''2'', name: ''Option B''},
{id: ''3'', name: ''Option C''}
],
selectedOption: ''2'' //This sets the default value of the select in the ui
};
}]);
})(window.angular);
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-select-with-default-values-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.0/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="defaultValueSelect">
<div ng-controller="ExampleController">
<form name="myForm">
<label for="mySelect">Make a choice:</label>
<select ng-model="data.selectedOption">
<option ng-repeat="option in data.availableOptions track by option.id" value="{{option.id}}">{{ option.name}}</option>
</select>
</form>
<hr>
<tt>option = {{data.selectedOption}}</tt><br/>
</div>
</body>
</html>
Fragmento de trabajo de tu demo
Cambie su etiqueta <select>
siguiente manera
<select ng-model="data.selectedOption">
<option ng-repeat="option in data.availableOptions track by option.id" value="{{option.id}}">{{ option.name}}</option>
</select>