javascript - 在编辑模式下执行 CRUD 操作时选择 ionic 选择选项

Question

我正在对多个字段执行 CRUD 操作。我对所有字段都有 [(ngModel)]。

I am not interested to changed the name of the [(ngModel)] or assign any value in the register.ts or edituser.ts file while loading. Since I have made the form to save the values successfully in the register mode to the DB. I need to show the Inserted value in the Edit user Form and how can i perform that.

注意:我在两种表单中都有几个其他字段，即文本字段、textarea、密码，但不知何故，我在注册过程和编辑用户部分中设法将数据保存到数据库中，我也有为除 ion-select 之外的所有其他输入类型显示在编辑模式下插入的值。

例如: 在注册表单中，如果用户在编辑模式中选择了“男性”作为选项，我需要保留用户的输入权限，但表单再次显示“性别”而不是显示选定的值。

下面我列出了包含 ion-select 的两种形式以及我所做的努力。

register.html

<ion-item>
  <ion-label floating>Gender</ion-label>
  <ion-select [(ngModel)]="gender">
     <ion-option value="Male">Male</ion-option>
     <ion-option value="Female">Female</ion-option>
  </ion-select>
</ion-item>

Edituser.html

我尝试了多种选择，但只有这个有效。但这不是我要找的。截至目前 [(ngModel)]="editUser.gender" 正在工作，并且在选项标签中选择了值，但这不是我想要的。我需要如下所示的模型 [(ngModel)]="gender" 但必须使用任何可用的方法来选择值。

<ion-item>
   <ion-label floating>Gender</ion-label>
   <ion-select [(ngModel)]="editUser.gender" name="gender">
      <ion-option value="Male">Male</ion-option>
      <ion-option value="Female">Female</ion-option>
   </ion-select>
</ion-item>

editUser 包含来自数据库的 JSON 数据。

这里的主要缺点是，当我像这样提供模型名称时，提交表单时不会获取值。所以我需要选择在不更改 [(ngModel)] 的情况下选择值。

My aim is to keep the Model as I have in the register.html form [(ngModel)]="gender" for both the Register and as well as the Edit Form.

Answer 1

我不相信有一种方法可以完成您所描述的事情。但是，有一个解决方法。 Ionic Select 组件会发出 ionic 变化事件，引用 Output Events API 文档中的部分。这是实现。

 <ion-select [(ngModel)]="gender" (ionChange)="onSelectChange($event)">