如何从 Ionic 动态选择选项中获取 ID 值和 NAME 值

Ant*_*nio 2 typescript ionic-framework ionic-native ionic3 angular

ionic 3,我已经成功实现了动态选择选项,我希望能够将所选到Option的ID值和Name值发送到服务器

因为我只能获得 ID 或名称,所以我无法获得两个值,请帮忙,我已经尝试了 JSON.parse,以及选项中的 id.value 和 name.value,但遗憾的是我是只能获得第一个值,不能同时获得

 <ion-list >
    <ion-item class="list-but">
      <ion-label>Tipo de Ambiente</ion-label>
      <ion-select
        [(ngModel)]="idType"
        multiple="false"
        cancelText="Cancelar"
        okText="Ok"
      >
        <ion-option
          *ngFor="let type of type_environment"
          value="{{ type.name }}"
          value="{{ type.id }}"
          #name
          >{{ type.name }}</ion-option
        >
      </ion-select>
    </ion-item>
  </ion-list>
  <button ion-button block (click)="insert()">Salvar</button>


``public type_environment = new Array<any>();
  public idType: number = 0;
  public nameType: string = "name";
  private userData: any;`
```

insert() {
    this.userData = this.user.getUserData();

    let body = {
      name: this.nameType,
      id_type: this.idType,
      id_unity: this.navParams.get("id.unidade")
    };
    console.log("name:", this.idType);

    this.route.postData("/ambiente", body).subscribe(
      data => {
        let response = data as any;

        let ret = JSON.parse(response._body);

        if (ret.insertId) {
          this.navCtrl.popToRoot();
        } else {
          console.log(ret);
        }
      },
      error => {
        console.log(error);
Run Code Online (Sandbox Code Playgroud)

AJT*_*T82 5

您不需要value在选择中有两个,只需将整个对象绑定到value,即:

<ion-select [(ngModel)]="idType" cancelText="Cancelar" okText="Ok">
  <ion-option *ngFor="let type of type_environment" [value]="type">
    {{ type.name }}
  </ion-option>
</ion-select>
Run Code Online (Sandbox Code Playgroud)

在此之后,您的对象值位于idType

insert() { 
  // below is your chosen object and its properties
  console.log(this.idType.id, this.idType.name)
}
Run Code Online (Sandbox Code Playgroud)

演示