Question

我正在尝试创建一个字段掩蔽，例如在输入时使用111之类的回车自动将其变为xxx。通过眼睛按钮，我将显示类似xxx或111的值。当眼睛图标打开时，当他输入1时，它将仅显示为1。当眼睛图标在输入1时关闭时，它将显示为x。我面临的问题是当他关闭眼睛图标时正在键入时，所有值都记录为xx。因此，当他单击眼睛图标使其亮起时，我没有原始值。有没有一种方法可以只更新视图值，并保持表单控件的值不变。请找到以下代码。

<Button app:onTouchListener="@{viewModel.onTouchListener}"/>

Answer 1

您可以更改输入类型，而无需替换输入值。

TS文件

  public inp_value= "";
  public tmp_value= "";
  public showPass = false;


maskValue() {
this.showPass = !this.showPass;
if(this.showPass){
  this.inp_value = this.tmp_value;
} else {
  this.tmp_value = this.inp_value;
  this.inp_value = "";
 for (var i = 0; i < this.tmp_value.lenght; i++)
   this.tmp_value+="x";
    }
}
}

html文件

<ion-item>
<ion-input type="text" placeholder="{{lang.Labels.Password}}" name="password" [(ngModel)]="inp_value" ></ion-input>
<button *ngIf="!showPass" ion-button clear color="dark" type="button" item-right (click)="maskValue()" style="font-size: 16px;"> <ion-icon name="ios-eye-off-outline"></ion-icon></button>

我希望这会帮助您了解掩码值。

通过单击角度为4的按钮来屏蔽和取消屏蔽输入字段值

1 个答案: