Voici ce qui semble déranger beaucoup de gens (dont moi).

Lorsque j'utilise la ng-optionsdirective dans AngularJS pour remplir les options d'une <select>balise, je ne peux pas comprendre comment définir la valeur d'une option. La documentation à ce sujet n'est vraiment pas claire - du moins pour un niais comme moi.

Je peux facilement définir le texte d'une option comme ceci:

ng-options="select p.text for p in resultOptions"

Quand resultOptionsest par exemple:

[
    {
        "value": 1,
        "text": "1st"
    },
    {
        "value": 2,
        "text": "2nd"
    }
]

Cela devrait être (et est probablement) la chose la plus simple pour définir les valeurs des options, mais jusqu'à présent, je ne comprends pas.

Voir ngOptions

ngOptions (facultatif) - { comprehension_expression=} - sous l'une des formes suivantes:

Pour les sources de données de tableau : label for value in array select as label for value in array label group by group for value in array select as label group by group for value in array track by trackexpr Pour les sources de données d'objet: label for (key , value) in object select as label for (key , value) in object label group by group for (key, value) in object select as label group by group for (key, value) in object

Dans votre cas, il devrait être

array = [{ "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" }];

<select ng-options="obj.value as obj.text for obj in array"></select>

Mise à jour

Avec les mises à jour sur AngularJS, il est désormais possible de définir la valeur réelle de l' valueattribut d' selectélément avec track byexpression.

<select ng-options="obj.text for obj in array track by obj.value">
</select>

Comment se souvenir de ces trucs laids

À toutes les personnes qui ont du mal à se souvenir de cette forme de syntaxe: je suis d'accord que ce n'est pas la syntaxe la plus simple ou la plus belle. Cette syntaxe est une sorte de version étendue des compréhensions de liste de Python et sachant que cela m'aide à me souvenir de la syntaxe très facilement. C'est quelque chose comme ça:

Code Python:

my_list = [x**2 for x in [1, 2, 3, 4, 5]]
> [1, 4, 9, 16, 25]

# Let people to be a list of person instances
my_list2 = [person.name for person in people]
> my_list2 = ['Alice', 'Bob']

Il s'agit en fait de la même syntaxe que la première répertoriée ci-dessus. Cependant, <select>nous devons généralement faire la différence entre la valeur réelle du code et le texte affiché (l'étiquette) dans un <select>élément.

Comme, nous avons besoin person.iddans le code, mais nous ne voulons pas montrer idà l'utilisateur; nous voulons montrer son nom. De même, nous ne sommes pas intéressés person.namepar le code. Il y a le asmot - clé pour étiqueter les trucs. Alors ça devient comme ça:

person.id as person.name for person in people

Ou, au lieu de person.idnous pourrions avoir besoin de l' personinstance / référence elle-même. Voir ci-dessous:

person as person.name for person in people

Pour les objets JavaScript, la même méthode s'applique également. N'oubliez pas que les éléments de l'objet sont déconstruits par (key, value)paires.

Comment l'attribut value obtient sa valeur:

• Lorsque vous utilisez un tableau comme source de données, ce sera l'index de l'élément tableau dans chaque itération;
• Lorsque vous utilisez un objet comme source de données, ce sera le nom de la propriété dans chaque itération.

Donc, dans votre cas, cela devrait être:

obj = { '1': '1st', '2': '2nd' };

<select ng-options="k as v for (k,v) in obj"></select>

J'avais aussi ce problème. Je n'ai pas pu définir ma valeur dans ng-options. Chaque option générée a été définie sur 0, 1, ..., n.

Pour faire les choses correctement, j'ai fait quelque chose comme ça dans mes ng-options:

HTML:

<select ng-options="room.name for room in Rooms track by room.price">
    <option value="">--Rooms--</option>
</select>

J'utilise "track by" pour définir toutes mes valeurs avec room.price .

(Cet exemple est nul: car s'il y avait plus d'un prix égal, le code échouerait. Assurez-vous donc d'avoir des valeurs différentes.)

JSON:

$scope.Rooms = [
            { name: 'SALA01', price: 100 },
            { name: 'SALA02', price: 200 },
            { name: 'SALA03', price: 300 }
        ];

Je l'ai appris dans un article de blog Comment définir la valeur sélectionnée initiale d'un élément sélectionné à l'aide d'Angular.JS ng-options & track by .

Voir la vidéo. C'est une belle classe :)

Si vous souhaitez modifier la valeur de vos optionéléments car le formulaire sera finalement soumis au serveur, au lieu de le faire,

<select name="text" ng-model="text" ng-options="select p.text for p in resultOptions"></select>

Tu peux le faire:

<select ng-model="text" ng-options="select p.text for p in resultOptions"></select>
<input type="hidden" name="text" value="{{ text }}" />

La valeur attendue sera alors envoyée via le formulaire sous le nom correct.

Pour envoyer une valeur personnalisée appelée my_heroau serveur à l'aide d'un formulaire normal, soumettez:

JSON:

"heroes": [
  {"id":"iron", "label":"Iron Man Rocks!"},
  {"id":"super", "label":"Superman Rocks!"}
]

HTML:

<select ng-model="hero" ng-options="obj.id as obj.label for obj in heroes"></select>
<input type="hidden" name="my_hero" value="{{hero}}" />

Le serveur recevra soit ironou superla valeur de my_hero.

Ceci est similaire à la réponse de @neemzy , mais en spécifiant des données distinctes pour l' valueattribut.

Il semble que ng-optionsc'est compliqué (peut-être frustrant) à utiliser, mais en réalité nous avons un problème d'architecture.

AngularJS sert de cadre MVC pour une application dynamique HTML + JavaScript. Bien que son composant (V) iew offre des «modèles» HTML, son objectif principal est de connecter les actions de l'utilisateur, via un contrôleur, aux modifications du modèle. Par conséquent, le niveau d'abstraction approprié, à partir duquel travailler dans AngularJS, est qu'un élément select définit une valeur dans le modèle à une valeur provenant d'une requête .

• La façon dont une ligne de requête est présentée à l'utilisateur est la préoccupation de (V) iew et ng-optionsfournit le formot clé pour dicter le contenu de l'élément d'option, c'est- à- direp.text for p in resultOptions .
• La façon dont une ligne sélectionnée est présentée au serveur est la préoccupation de (M) odel. ng-optionsFournit donc le asmot - clé pour spécifier quelle valeur est fournie au modèle comme dans k as v for (k,v) in objects.

La solution correcte à ce problème est alors de nature architecturale et implique la refactorisation de votre code HTML afin que le (M) odel effectue la communication avec le serveur lorsque cela est nécessaire. (au lieu que l'utilisateur soumette un formulaire).

Si une page HTML MVC ne nécessite pas une ingénierie excessive pour le problème en question: alors utilisez uniquement la partie de génération HTML du composant (V) iew d'AngularJS. Dans ce cas, suivez le même modèle que celui utilisé pour générer des éléments tels que <li />«sous <ul />» et placez une répétition ng sur un élément option:

<select name=“value”>
    <option ng-repeat=“value in Model.Values” value=“{{value.value}}”>
        {{value.text}}
    </option>
</select>

Comme kludge , on peut toujours déplacer l'attribut name de l'élément select vers un élément d'entrée caché:

<select ng-model=“selectedValue” ng-options=“value.text for value in Model.Values”>
</select>
<input type=“hidden” name=“value” value=“{{selectedValue}}” />

Tu peux le faire:

<select ng-model="model">
    <option value="">Select</option>
    <option ng-repeat="obj in array" value="{{obj.id}}">{{obj.name}}</option>
</select>

-- MISE À JOUR

Après quelques mises à jour, l' utilisateur frm.adiputra solution de est beaucoup mieux. Code:

obj = { '1': '1st', '2': '2nd' };
<select ng-options="k as v for (k,v) in obj"></select>

J'ai lutté avec ce problème pendant un certain temps aujourd'hui. J'ai lu la documentation AngularJS, ce poste et d'autres et quelques blogs vers lesquels ils mènent. Ils m'ont tous aidé à régler les moindres détails, mais au final, cela semble être un sujet déroutant. Principalement à cause des nombreuses nuances syntaxiques deng-options .

En fin de compte, pour moi, cela revient à moins, c'est plus.

Étant donné une étendue configurée comme suit:

        //Data used to populate the dropdown list
        $scope.list = [
           {"FirmnessID":1,"Description":"Soft","Value":1},         
           {"FirmnessID":2,"Description":"Medium-Soft","Value":2},
           {"FirmnessID":3,"Description":"Medium","Value":3}, 
           {"FirmnessID":4,"Description":"Firm","Value":4},     
           {"FirmnessID":5,"Description":"Very Firm","Value":5}];

        //A record or row of data that is to be save to our data store.
        //FirmnessID is a foreign key to the list specified above.
        $scope.rec = {
           "id": 1,
           "FirmnessID": 2
        };

C'est tout ce dont j'avais besoin pour obtenir le résultat souhaité:

        <select ng-model="rec.FirmnessID"
                ng-options="g.FirmnessID as g.Description for g in list">
            <option></option>
        </select>   

Remarquez que je n'ai pas utilisé track by. L'utilisation de track byl'élément sélectionné retournerait toujours l'objet correspondant au FirmnessID, plutôt qu'au FirmnessID lui-même. Cela répond maintenant à mes critères, c'est-à-dire qu'il devrait renvoyer une valeur numérique plutôt que l'objet, et utiliserng-options pour obtenir l'amélioration des performances qu'il fournit en ne créant pas de nouvelle étendue pour chaque option générée.

En outre, je avais besoin la première ligne vide, donc j'ai simplement ajouté un <option>à la<select> élément.

Voici un Plunkr qui montre mon travail.

Au lieu d'utiliser la nouvelle fonctionnalité "track by", vous pouvez simplement le faire avec un tableau si vous souhaitez que les valeurs soient les mêmes que le texte:

<select ng-options="v as v for (k,v) in Array/Obj"></select>

Notez la différence entre la syntaxe standard, qui fera des valeurs les clés de l'Object / Array, et donc 0,1,2 etc. pour un tableau:

<select ng-options"k as v for (k,v) in Array/Obj"></select>

k as v devient v as v .

J'ai découvert cela simplement sur la base du bon sens en regardant la syntaxe. (k, v) est l'instruction réelle qui divise le tableau / objet en paires de valeurs clés.

Dans l'instruction 'k as v', k sera la valeur et v sera l'option de texte affichée à l'utilisateur. Je pense que «suivre» est désordonné et exagéré.

Selon moi, cela convenait le mieux à tous les scénarios:

<select ng-model="mySelection.value">
   <option ng-repeat="r in myList" value="{{r.Id}}" ng-selected="mySelection.value == r.Id">{{r.Name}}
   </option>
</select>

où vous pouvez utiliser votre modèle pour lier les données. Vous obtiendrez la valeur telle que contiendra l'objet et la sélection par défaut en fonction de votre scénario.

Voilà comment j'ai résolu cela. J'ai suivi la sélection par valeur et défini la propriété d'élément sélectionnée sur le modèle dans mon code JavaScript.

Countries =
[
    {
        CountryId = 1, Code = 'USA', CountryName = 'United States of America'
    },
    {
       CountryId = 2, Code = 'CAN', CountryName = 'Canada'
    }
]

<select ng-model="vm.Enterprise.AdminCountry" ng-options="country.CountryName for country in vm.Countries track by country.CountryId">

vmest mon contrôleur et le pays du contrôleur récupéré du service est {CountryId =1, Code = 'USA', CountryName='United States of America'}.

Lorsque j'ai sélectionné un autre pays dans la liste déroulante de sélection et publié ma page avec "Enregistrer", j'ai obtenu le bon pays lié.

La ng-optionsdirective ne définit pas l'attribut value sur les <options>éléments des tableaux:

En utilisant des limit.value as limit.text for limit in limitsmoyens:

définissez le <option>libellé de 'comme limit.text
enregistrer la limit.valuevaleur dans la sélectionng-model

Voir la question Stack Overflow AngularJS ng-options ne rendant pas les valeurs .

<select ng-model="color" ng-options="(c.name+' '+c.shade) for c in colors"></select><br>

Vous pouvez utiliser ng-options pour obtenir une liaison de balise select à la valeur et afficher les membres

Lors de l'utilisation de cette source de données

countries : [
              {
                 "key": 1,
                 "name": "UAE"
             },
              {
                  "key": 2,
                  "name": "India"
              },
              {
                  "key": 3,
                  "name": "OMAN"
              }
         ]

vous pouvez utiliser ce qui suit pour lier votre balise de sélection à la valeur et au nom

<select name="text" ng-model="name" ng-options="c.key as c.name for c in countries"></select>

ça marche super

La réponse correcte à cette question a été fournie par l'utilisateur frm.adiputra , car actuellement cela semble être le seul moyen de contrôler explicitement l'attribut value des éléments d'option.

Cependant, je voulais juste souligner que "sélectionner" n'est pas un mot-clé dans ce contexte, mais juste un espace réservé pour une expression. Veuillez vous référer à la liste suivante, pour la définition de l'expression "select" ainsi que d'autres expressions qui peuvent être utilisées dans la directive ng-options.

L'utilisation de select telle qu'elle est décrite dans la question:

ng-options='select p.text for p  in resultOptions'

est essentiellement faux.

Sur la base de la liste des expressions, il semble que trackexpr puisse être utilisé pour spécifier la valeur, lorsque des options sont données dans un tableau d'objets, mais il a été utilisé avec un regroupement uniquement.

De la documentation d'AngularJS pour ng-options:

• tableau / objet : une expression qui s'évalue en un tableau / objet sur lequel itérer.
• valeur : variable locale qui fera référence à chaque élément du tableau ou à chaque valeur de propriété de l'objet lors de l'itération.
• key : variable locale qui fera référence à un nom de propriété dans l'objet lors de l'itération.
• label : Le résultat de cette expression sera le label de l'élément. L'expression fera très probablement référence à la variable de valeur (par exemple value.propertyName).
• select : Le résultat de cette expression sera lié au modèle de l'élément parent. S'il n'est pas spécifié, sélectionnez par défaut la valeur à expression.
• group : Le résultat de cette expression sera utilisé pour regrouper les options à l'aide de l'élément DOM.
• trackexpr : utilisé lorsque vous travaillez avec un tableau d'objets. Le résultat de cette expression sera utilisé pour identifier les objets du tableau. Le trackexpr fera très probablement référence à la variable de valeur (par exemple value.propertyName).

La sélection d'un élément dans ng-options peut être un peu délicate selon la façon dont vous définissez la source de données.

Après avoir lutté avec eux pendant un certain temps, j'ai fini par faire un échantillon avec les sources de données les plus courantes que j'utilise. Vous pouvez le trouver ici:

http://plnkr.co/edit/fGq2PM?p=preview

Maintenant, pour faire fonctionner ng-options, voici quelques éléments à considérer:

1. Normalement, vous obtenez les options d'une source et la valeur sélectionnée d'une autre. Par exemple:
   • states :: données pour ng-options
   • user.state :: Option pour définir comme sélectionné
2. Sur la base de 1, la chose la plus simple / logique à faire est de remplir la sélection avec une seule source, puis de définir le code de la valeur sélectionnée. Il serait rarement préférable d'obtenir un ensemble de données mixte.
3. AngularJS permet à certains contrôles de contenir plus de key | label. De nombreux exemples en ligne mettent les objets en tant que «clé», et si vous avez besoin d'informations de l'objet, définissez-les de cette façon, sinon utilisez la propriété spécifique dont vous avez besoin comme clé. (ID, CODE, etc. Comme dans l'exemple plckr)

4. La façon de définir la valeur du contrôle déroulant / sélectionner dépend de # 3,

   • Si la clé déroulante est une propriété unique (comme dans tous les exemples du plunkr), vous la définissez simplement, par exemple: $scope.dropdownmodel = $scope.user.state;

   • Si vous définissez l'objet comme clé, vous devez parcourir les options, même l'attribution de l'objet ne définira pas l'élément comme sélectionné car ils auront des touches de hachage différentes, par exemple:

     for (var i = 0, len = $scope.options.length; i < len; i++) {
       if ($scope.options[i].id == savedValue) { // Your own property here:
         console.log('Found target! ');
         $scope.value = $scope.options[i];
         break;
       }
     }

Vous pouvez remplacer savedValue pour la même propriété dans l'autre objet, $scope.myObject.myProperty.

Pour moi, la réponse de Bruno Gomes est la meilleure réponse.

Mais en réalité, vous n'avez pas à vous soucier de définir la propriété value de certaines options. AngularJS s'en chargera. Permettez-moi de vous expliquer en détail.

Veuillez considérer ce violon

angular.module('mySettings', []).controller('appSettingsCtrl', function ($scope) {

    $scope.timeFormatTemplates = [{
        label: "Seconds",
        value: 'ss'
    }, {
        label: "Minutes",
        value: 'mm'
    }, {
        label: "Hours",
        value: 'hh'
    }];


    $scope.inactivity_settings = {
        status: false,
        inactive_time: 60 * 5 * 3, // 15 min (default value), that is, 900 seconds
        //time_format: 'ss', // Second (default value)
        time_format: $scope.timeFormatTemplates[0], // Default seconds object
    };

    $scope.activity_settings = {
        status: false,
        active_time: 60 * 5 * 3, // 15 min (default value), that is,  900 seconds
        //time_format: 'ss', // Second (default value)
        time_format: $scope.timeFormatTemplates[0], // Default seconds object
    };

    $scope.changedTimeFormat = function (time_format) {
        'use strict';

        console.log('time changed');
        console.log(time_format);
        var newValue = time_format.value;

        // do your update settings stuffs
    }
});

Comme vous pouvez le voir dans la sortie du violon, quoi que vous choisissiez pour les options de sélection, c'est votre valeur personnalisée ou la valeur générée automatiquement 0, 1, 2 par AngularJS, cela n'a pas d'importance dans votre sortie, sauf si vous utilisez jQuery ou tout autre autre bibliothèque pour accéder à la valeur des options de la zone de liste déroulante sélectionnée et la manipuler en conséquence.

Un an après la question, j'ai dû trouver une réponse à cette question car aucun d'eux n'a donné la réponse réelle, du moins pour moi.

Vous avez demandé comment sélectionner l'option, mais personne n'a dit que ces deux choses ne sont PAS les mêmes:

Si nous avons une option comme celle-ci:

$scope.options = [
    { label: 'one', value: 1 },
    { label: 'two', value: 2 }
  ];

Et nous essayons de définir une option par défaut comme celle-ci:

$scope.incorrectlySelected = { label: 'two', value: 2 };

Cela ne fonctionnera PAS , mais si vous essayez de sélectionner l'option comme ceci:

$scope.correctlySelected = $scope.options[1];

Il TRAVAIL .

Même si ces deux objets ont les mêmes propriétés, AngularJS les considère comme DIFFÉRENTS car AngularJS compare par la référence .

Jetez un œil au violon http://jsfiddle.net/qWzTb/ .

Veuillez utiliser la piste par propriété qui différencie les valeurs et les étiquettes dans la zone de sélection.

S'il vous plaît essayez

<select ng-options="obj.text for obj in array track by obj.value"></select>

qui attribuera des étiquettes avec du texte et une valeur avec une valeur (à partir du tableau)

Pour un objet:

<select ng-model="mySelect" ng-options="key as value for (key, value) in object"></select>

Il est toujours pénible pour les développeurs d'utiliser ng-options. Par exemple: obtenir une valeur sélectionnée vide / vide dans la balise de sélection. Surtout lorsqu'il s'agit d'objets JSON dans ng-options, cela devient plus fastidieux. Ici, j'ai fait quelques exercices à ce sujet.

Objectif: itérer le tableau d'objets JSON via l'option ng et définir le premier élément sélectionné.

Les données:

someNames = [{"id":"1", "someName":"xyz"}, {"id":"2", "someName":"abc"}]

Dans la balise select, je devais afficher xyz et abc, où xyz doit être sélectionné sans trop d'effort.

HTML:

<pre class="default prettyprint prettyprinted" style=""><code>
    &lt;select class="form-control" name="test" style="width:160px"    ng-options="name.someName for name in someNames" ng-model="testModel.test" ng-selected = "testModel.test = testModel.test || someNames[0]"&gt;
&lt;/select&gt;
</code></pre>

Par l'exemple de code ci-dessus, vous pourriez sortir de cette exagération.

Une autre référence :

Le tutoriel ANGULAR.JS: NG-SELECT ET NG-OPTIONS m'a aidé à résoudre le problème:

<select id="countryId"
  class="form-control"
  data-ng-model="entity.countryId"
  ng-options="value.dataValue as value.dataText group by value.group for value in countries"></select>

<select ng-model="output">
   <option ng-repeat="(key,val) in dictionary" value="{{key}}">{{val}}</option>
</select>

Exécutez l'extrait de code et voyez les variations. Voici une note pour une compréhension rapide

1. Exemple 1 (sélection d'objet): - ng-option="os.name for os in osList track by os.id". Voici track by os.idimportant et devrait être là et os.id as ne devrait pas avoir avant os.name.

   • Le ng-model="my_os"doit être défini sur un objet avec la clé comme id comme my_os={id: 2}.

2. Exemple 2 (sélection de valeur): - ng-option="os.id as os.name for os in osList". Ici track by os.id ne devrait PAS être là et os.id as devrait être là avant os.name.

   • La valeur ng-model="my_os"doit être définie sur une valeur telle quemy_os= 2

Un extrait de code de repos vous expliquera.

angular.module('app', []).controller('ctrl', function($scope, $timeout){
  
  //************ EXAMPLE 1 *******************
  $scope.osList =[
    { id: 1, name :'iOS'},
    { id: 2, name :'Android'},
    { id: 3, name :'Windows'}
  ]
  $scope.my_os = {id: 2};
  
  
  //************ EXAMPLE 2 *******************
  $timeout(function(){
    $scope.siteList = [
          { id: 1, name: 'Google'},
          { id: 2, name: 'Yahoo'},
          { id: 3, name: 'Bing'}
        ];
   }, 1000);
    
    $scope.my_site = 2;
  
    $timeout(function(){
      $scope.my_site = 3;
    }, 2000);
})

fieldset{
  margin-bottom: 40px;
  }
strong{
  color:red;
  }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.10/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">

  <!--//************ EXAMPLE 1 *******************-->
  <fieldset>
    <legend>Example 1 (Set selection as <strong>object</strong>)</legend>
    
    <select ng-model="my_os" ng-options="os.name for os in osList track by os.id">
        <option value="">--Select--</option>
      </select>
    {{my_os}}
    
  </fieldset>
  
  
  <!--//************ EXAMPLE 2 *******************-->
  <fieldset>
    <legend>Example 2 (Set selection as <strong>value</strong>. Simulate ajax)</legend>
      <select ng-model="my_site" ng-options="site.id as site.name for site in siteList">
        <option value="">--Select--</option>
      </select>
      {{my_site}}
  </fieldset>
  
</div>

Comme beaucoup l'ont dit auparavant, si j'ai des données comme ceci:

countries : [
              {
                 "key": 1,
                 "name": "UAE"
             },
              {
                  "key": 2,
                  "name": "India"
              },
              {
                  "key": 3,
                  "name": "OMAN"
              }
         ]

Je l'utiliserais comme:

<select
    ng-model="selectedCountry"
    ng-options="obj.name for obj  in countries">
</select>

Dans votre contrôleur, vous devez définir une valeur initiale pour vous débarrasser du premier élément vide:

 $scope.selectedCountry = $scope.countries[0];

 // You need to watch changes to get selected value
 $scope.$watchCollection(function() {
   return $scope.selectedCountry
 }, function(newVal, oldVal) {
     if (newVal === oldVal) {
       console.log("nothing has changed " + $scope.selectedCountry)
     } 
     else {
       console.log('new value ' + $scope.selectedCountry)
     }
 }, true)

Voici comment je résous ce problème dans une application héritée:

En HTML:

ng-options="kitType.name for kitType in vm.kitTypes track by kitType.id" ng-model="vm.itemTypeId"

En JavaScript:

vm.kitTypes = [
    {"id": "1", "name": "Virtual"},
    {"id": "2", "name": "Physical"},
    {"id": "3", "name": "Hybrid"}
];

...

vm.itemTypeId = vm.kitTypes.filter(function(value, index, array){
    return value.id === (vm.itemTypeId || 1);
})[0];

Mon HTML affiche correctement la valeur de l'option.

Directive ngOptions:

$scope.items = [{name: 'a', age: 20},{ name: 'b', age: 30},{ name: 'c', age: 40}];

• Case-1) étiquette pour la valeur dans le tableau:

  <div>
      <p>selected item is : {{selectedItem}}</p>
      <p> age of selected item is : {{selectedItem.age}} </p>
      <select ng-model="selectedItem" ng-options="item.name for item in items">
      </select>
  </div>

Explication de la sortie (en supposant que le premier élément est sélectionné):

selectedItem = {nom: 'a', âge: 20} // [par défaut, l'élément sélectionné est égal à l' élément de valeur ]

selectedItem.age = 20

• Cas-2) sélectionnez comme étiquette pour la valeur dans le tableau:

  <div>
      <p>selected item is : {{selectedItem}}</p>
      <select ng-model="selectedItem" ng-options="item.age as item.name for item in items">
      </select>
  </div>

Explication de la sortie (en supposant que le premier élément est sélectionné): selectedItem = 20 // [la pièce sélectionnée est item.age ]