如何从离子选择中获取项目的所有信息?

Question

我从Firestore加载项目列表并将它们放入离子选择中，问题是由于每个项目都有一个 id，我需要获取选择的 id。

这是我在控制器中获取项的代码。

this.MesasColeccion = this.mesasser.getMesaListfromFirestore();
this.MesasColeccion.snapshotChanges().subscribe(mesasLista => {
this.mesas  = mesasLista.map(mesa => {
return {
nombre: mesa.payload.doc.data().nombre,
capacidad: mesa.payload.doc.data().capacidad,
estado: mesa.payload.doc.data().estado,
union:mesa.payload.doc.data().union,
id: mesa.payload.doc.id
}
});
this.mesas2  = mesasLista.map(mesa2 => {
return {
nombre: mesa2.payload.doc.data().nombre,
capacidad: mesa2.payload.doc.data().capacidad,
estado: mesa2.payload.doc.data().estado,
union:mesa2.payload.doc.data().union,
id: mesa2.payload.doc.id
}
});
});
this.MesasObservable = this.MesasColeccion.valueChanges();

这是在离子选择中显示列表的代码：

<ion-card>
<ion-card-content>
<ion-item id="mesas-select1">
<ion-label >
Mesa #1:
</ion-label>
<ion-select  [(ngModel)]='Gruposobj.nombrem1' name="Mesa#1" placeholder="Selecciona la mesa"  >
<ion-option   *ngFor="let mesa of mesas">
{{mesa.nombre}}
</ion-option>
</ion-select>
</ion-item>
<ion-item id="mesas-select1">
<ion-label >
Mesa #2:
</ion-label>
<ion-select [(ngModel)]='Grupos2obj.nombrem2' name="Mesa#2" placeholder="Selecciona la mesa" >
<ion-option *ngFor="let mesa2 of mesas2" >
{{mesa2.nombre}}
</ion-option>
</ion-select>
</ion-item>

ngmodel将选定的选项分配给 GruposModel 中的属性。在这种情况下，vinculacionmodel的对象是Gruposobj和Grupos2obj。当用户选择离子选择的项目时，我需要从项目中获取选择的 id。因为我将使用Gruposobj.mesa1 && Gruposobj.mesa2将此 mesa.id&&mesa2.id 分配给vinculacionmodel。

这是vinculacion模型：

export interface vinculacionmodel {

id?:string;
mesa1:string;
mesa2:string;
mesa3:string;
nombrem1:string;
nombrem2:string;
nombrem3:string;
}

Answer 1

由于您想要来自对象的 ID，您可以在ion-select上实现ionChange事件，并将获得选定的对象。

有关更多详细信息，请参阅以下代码。

<ion-select [(ngModel)]='Grupos2obj.nombrem2' name="Mesa#2" placeholder="Selecciona la mesa" (ionChange)="onSelectChange($event)">
<ion-option *ngFor="let mesa2 of mesas2" [value]="mesa2['id']">
{{mesa2.nombre}}
</ion-option>
</ion-select>

.ts 文件中的离子更改事件：

onSelectChange(selectedValue: any) {
//Selected Value Id will get as param ==> selectedValue
//Selected Object
var item = this.mesas2.find(item => item['id'] === selectedValue);
//Position of object in array
var postion = this.mesas2.findIndex(item => item['id'] === selectedValue);
}

希望这能帮助您从ios-select获取身份证。