Comment obtenir la valeur de ion-sélectionnez l'option

J'ai un tableau d'objet appelé options.

c'est mon code html

    <ion-item>
        <ion-label>place</ion-label>

        <ion-select [(ngModel)]="place" (click)="optionsFn(item);">
          <ion-option value="item" *ngFor="let item of options">{{item.name}} &nbsp;&nbsp;{{item.price}}</ion-option> 
        </ion-select>
      </ion-item>

{{salespriceOp}}

{{quantityOp}}

c'est mon .ts fichier de code

product_option_value_idOp
  priceOp
  salespriceOp
  quantityOp
  skuOp
  nameOp

  options =  [
          {
            "product_option_value_id": "45",
            "name": "Bangalore Auto",
            "quantity": "12",
            "sku": "56876",
            "price": "100.00",
            "salesprice": "50"
          },
          {
            "product_option_value_id": "51",
            "name": "Hyderabad Auto",
            "quantity": "23",
            "sku": "56543",
            "price": "200.00",
            "salesprice": "60"
          },
          {
            "product_option_value_id": "52",
            "name": "Delhi Auto",
            "quantity": "14",
            "sku": "98767",
            "price": "300.00",
            "salesprice": "80"
          }
        ];
  constructor(public navCtrl: NavController) {

  }

  optionsFn(item) {//here item is an object 
    console.log(item);
    this.product_option_value_idOp = item.product_option_value_id;
    this.priceOp = item.price;
    this.salespriceOp = item.salesprice;
    this.quantityOp = item.quantity;
    this.skuOp = item.sku;
    this.nameOp = item.name;
  }

je suis en mesure d'appeler la fonction, mais je suis pas définie dans console.log(item)

sa ne fonctionne pas parce que vous appelez optionsFn fonction de balise select. vous devez l'ajouter sur ion-option tag
je pense que sur les fonctions doivent être utilisés sur ion-select tag seulement si j'utilise dans ion-options tag je ne suis pas en mesure d'invoquer la fonction elle-même
Donc, pour l'utiliser à d'ions sélectionner vous devez attribuer [value]=item dans ion-option et ont besoin d'utiliser gaming dans votre optionsFn fonction. donc, supprimer argument de optionsFn et essayer de le vérifier.
La valeur de chaque option est en cours de mise à nes. Vous êtes à la liaison de la valeur de sélectionner à quelque chose appelé gaming mais vous ne semblez pas l'avoir dans votre classe de composant. Pouvez-vous s'il vous plaît poster votre composante à part entière de la classe.
je pense que vous vous trompez, je suis en train d'envoyer l'élément de l'objet en tant que paramètre optionsFn(item)

OriginalL'auteur Mohan Gopi | 2016-09-15

13

Il y avait plusieurs choses qui, ensemble, a causé l'erreur.
Le premier changement est que au lieu d'utiliser le click événement comme celui-ci:
```
(click)="optionsFn(item);
```
Vous devez utiliser le ionChange événement qui Ionique expose comme ceci:
```
(ionChange)="optionsFn();"
```
Également d'avis que, puisque vous utilisez le [(ngModel)]="place" pour lier le sélectionner l'élément à l'une de vos propriétés du composant, vous n'avez pas besoin d'envoyer l'élément en tant que paramètre, car this.place sera l'élément sélectionné lorsque la ionChange événement est déclenché.

C'est pourquoi votre optionsFn méthode devrait ressembler à ceci:
```
public optionsFn(): void { //here item is an object 
    console.log(this.place);

    let item = this.place; //Just did this in order to avoid changing the next lines of code :P

    this.product_option_value_idOp = item.product_option_value_id;
    this.priceOp = item.price;
    this.salespriceOp = item.salesprice;
    this.quantityOp = item.quantity;
    this.skuOp = item.sku;
    this.nameOp = item.name;
  }
```
dans votre plunker vous êtes en utilisant le prix de vente et pice à l'intérieur de la ion-liste elle-même, mais j'ai besoin d'afficher à l'extérieur de la liste si seulement j'essaie d'envoyer la totalité de l'objet en tant que paramètre
Mais vous pouvez utiliser place?.salespriceOp pour montrer où vous voulez parce que c'est une partie de la composante.
Si vous voulez, je peux changer le plunker pour vous montrer comment le faire 🙂
comment rendre les options pour être sélectionné au premier point, parce que mon ion-option initialement montrant la valeur null. j'ai essayé d'utiliser checked="true" mais je ne suis pas en mesure de voir l'option sélectionnée initialement
Dans le constructeur, vous devriez faire this.place = this.options[0] (si vous souhaitez sélectionner le premier élément).

OriginalL'auteur sebaferreras

Utilisation (ngModelChange) au lieu de (sur) l'événement.

(ngModelChange)="optionsFn()"

chaque fois que la valeur de modèle modifié le ngModelChange appeler automatiquement la fonction relative.

<ion-item>
  <ion-label>place</ion-label>
  <ion-select [(ngModel)]="place" (ngModelChange)="optionsFn(item)">
      <ion-option value="item" *ngFor="let item of options">{{item.name}} &nbsp;&nbsp;{{item.price}}</ion-option> 
  </ion-select>
</ion-item>

OriginalL'auteur ragav

-1

Vérifier après faire des changements suivants :

//html changement

<ion-select [(ngModel)]="gaming" (change)="optionsFn();">
  <ion-option [value]="item" *ngFor="let item of options">{{item.name}} &nbsp;&nbsp;{{item.price}}</ion-option> 
</ion-select>

//.ts changement

optionsFn() {
  console.log(this.gaming);
  let item = this.gaming;
  this.product_option_value_idOp = item.product_option_value_id;
  this.priceOp = item.price;
  this.salespriceOp = item.salesprice;
  this.quantityOp = item.quantity;
  this.skuOp = item.sku;
  this.nameOp = item.name;
}

je pense que j'obtiens le même message d'erreur
pouvez vous s'il vous plaît vérifier en changeant value="item" à [value]="item"
je pense que [la] cette crochets sont utilisés dans angulaire 2 pour obtenir la valeur de ts fichier html

OriginalL'auteur ranakrunal9

Vous devez vous connecter pour publier un commentaire.