在编辑模式下执行CRUD操作时，选择离子选择选项-Java 学习之路

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

我不想更改[（ngModel）]的名称或在加载时在register.ts或edituser.ts文件中指定任何值 . 因为我已经将表格在寄存器模式下成功保存到DB . 我需要在编辑用户表单中显示Inserted值，以及如何执行该操作 .

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

Eg: 如果用户在编辑模式中选择"Male"作为选项，则在注册表单中我需要保留用户的输入权限，但表格再次显示"Gender"而不是显示所选值 .

下面我列出了包含 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数据 .

这里的主要缺点是，当我提供这样的modelname时，在提交表单时不会获取值 . 所以我需要选择在没有 [(ngModel)] 的变化的情况下选择值 .

我的目标是按照寄存器和编辑表格的register.html格式[（ngModel）] =“性别”保留模型 .

3 回答

7
我不相信有办法做你所描述的 . 但是，有一个解决方法 . Ionic Select组件将发出离子变化事件，请参阅API文档中的Output Events部分 . 这是实施 .
```
<ion-select [(ngModel)]="gender" (ionChange)="onSelectChange($event)">
```
回复于 2024-04-27T08:50:52+08:00
3
在加载页面上，从 editUser 对象获取 gender
```
ionViewDidLoad(){
    this.gender = this.editUser.gender;
    }
```
回复于 2024-04-27T08:50:52+08:00

您的TypeScript组件看起来应该类似于：

import { Component } from '@angular/core';
// ...

@Component({
  templateUrl: 'Edituser.html'
})

export class YOURCOMPONENT {

  // ...

  constructor () {

    this.gender = this.editUser.gender;

  // ...

回复于 2024-04-27T08:50:52+08:00

在编辑模式下执行CRUD操作时，选择离子选择选项

3 回答

相关问题