J'ai un DropDown. Je lie sa valeur en utilisant ng-repeat
sur Option. Je souhaite définir la valeur sélectionnée à l'aide du champ de valeur uniquement.
Ceci est mon code.
<div ng-controller="myCtrl">
<select ng-model="selectedItemvalue">
<option value="">--Select --</option>
<option ng-repeat="sel in selectables" value="{{sel.value}}">{{sel.label}}</option>
</select>
<p>Selected Value is : {{selectedItemvalue}}</p>
</div>
Js
angular.module('myApp', [])
// controller here
.controller('myCtrl', function($scope) {
$scope.selectables = [
{ label: 'A', value: 1},
{ label:'B', value: 2},
{ label: 'C', value: 3}
];
// this is the model that's used for the data binding in the select directive
// the default selected item
//using value, i want to set the selected value
$scope.selectedItemvalue = "2";
})
Comme vous pouvez le constater, je souhaite définir la valeur sélectionnée en définissant uniquement Valeur.
Vous devez utiliser ng-model
au lieu de ng-value
pour le lier au modèle.
<select ng-model="selectedItemvalue">
Mise à jour: $scope.selectedItem
doit être $scope.selectedItemvalue
dans le contrôleur, puis vous pouvez utiliser ng-selected
pour y faire correspondre la condition.
Démo de travail
angular
.module('myApp', [])
// controller here
.controller('myCtrl', function($scope) {
$scope.selectables = [
{ label: 'A', value: 1},
{ label:'B', value: 2},
{ label: 'C', value: 3}
];
// this is the model that's used for the data binding in the select directive
// the default selected item
//using value, i want to set the selected value
$scope.selectedItemvalue = "2";
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
<div ng-controller="myCtrl" ng-app="myApp">
<select ng-model="selectedItemvalue">
<option value="">--Select --</option>
<option ng-repeat="sel in selectables" ng-selected="selectedItemvalue == sel.value" value="{{sel.value}}">{{sel.label}}</option>
</select>
<p>Selected Value is : {{selectedItemvalue}}</p>
</div>
Vous devez utiliser essentiellement la syntaxe suivante pour votre balise option
(utilisez ng-selected
):
<option ng-repeat="sel in selectables" value="{{sel.value}}" ng-selected="sel.value == selectedItemvalue">{{sel.label}}</option>
Si tu essayes
$ scope.selectedItemvalue = {label: 'B', valeur: 2};
alors ça va marcher.