Angulaire 2: Comment obtenir la valeur sélectionnée à partir de différentes options d'un formulaire?

Je voudrais utiliser un <select> dans un formulaire pour permettre à l'utilisateur d'être en mesure de mettre à jour les valeurs entre les différents <option>. J'ai utilisé la technique du guide ici: https://angular.io/docs/ts/latest/guide/forms.html. Voici l'exemple dont je parle:

<div class="form-group">
    <label for="type">Type :</label>
    <select class="form-control" [(ngModel)]="order.type" ngControl="type">
        <option *ngFor="#type of types" [value]="type">{{type}}</option>
    </select>
</div>

Dans ma commande-détails.composante j'ai une updateOrder() qui appelle la updateOrder() à partir de myApp.services.

Mon problème est que lorsque j'essaie d'envoyer les données du formulaire à l'arrière-end: toutes les pièces avec un <input> sont OK, mais pas ceux avec <select> (il retourne les valeurs d'origine, et non pas celui sélectionné).

Quelqu'un aurait-il rencontré ce ou un problème similaire?
Merci pour votre aide!

Ressemble à une dup de stackoverflow.com/questions/34686855/...

OriginalL'auteur Yannick Morel | 2016-01-22

  1. 21

    Il y a un moyen d'obtenir la valeur d'options différentes.
    cochez cette plunker

    component.html

     <select class="form-control" #t (change)="callType(t.value)">
      <option *ngFor="#type of types" [value]="type">{{type}}</option>
    </select>

    composant.ts 

    this.types = [ 'type1', 'type2', 'type3' ];
   this.order = {
      type: 'type1'          
  };  

  callType(value){
    console.log(value);
    this.order.type=value;
  }

    OriginalL'auteur Mubashir

  2. 3

    Essaie de résoudre ce problème pour quelques heures.

    Vérifié dans l' (incomplet) de la documentation pour trouver un élément dans la NgSelectOption page appelée "ngValue"

    Ne sais pas si c'est l'utilisation prévue, mais elle semblait aller bien.

    Donc, au lieu d'utiliser 

    [value]="item"

    Utilisation:

    [ngValue]="item"

    Suffit d'utiliser ngModel sur la sélection et ngModelChange cas si vous voulez faire quelque chose quand elle change.

    OriginalL'auteur Jason

  3. 1

    En fait je ne peux pas reproduire votre problème. J'ai créé un plunkr avec une forme très simple avec un input et un select. Lorsque je soumets le formulaire, j'ai les valeurs réelles de l'objet lié. Voir ce plunkr: https://plnkr.co/edit/5C3agW7QZfcrdt88QzSh?p=preview.

    Hésitez pas à me dire si je n'avais pas bien comprendre votre problème.

    Thierry

    En fait, il semble que vous avez reproduit mon problème dans votre plunkr: lorsque j'essaie d'envoyer votre formulaire, j'obtiens la valeur correcte à l'intérieur de la <input>, mais quel que soit le type je choisis dans le <select>, le journal de la console dit "type1". Ne pas vous avez le même comportement? Merci pour le temps que vous avez pris pour reproduire le problème par la voie 🙂
    Mubashir avez résolu mon problème maintenant, mais merci pour votre temps!

    OriginalL'auteur Thierry Templier