Question

我正在使用PrimeNG的inputMask字段

<p-inputMask name="maskValue" [(ngModel)]="attr.attributeValue" mask="aa/99" placeholder="aa/99"></p-inputMask>

{{attr.attributeValue}}

但是，如果我在文本框中输入a并将注意力集中，则该文本框正在清除，但ng-model attr.attributeValue仍然保留值a_/__。我们怎样才能清除ng模型？

Answer 1

通过查看source of inputMask，您可以看到有一个名为filled的布尔属性。

因此，我们可以通过ViewChild以及使用onBlur事件来访问该属性的值，以了解输入是否已填充，如果未填充，则可以重新初始化模型。

<强> HTML

<p-inputMask #myInputMask name="maskValue" [(ngModel)]="attr.attributeValue" mask="aa/99" placeholder="aa/99" (onBlur)="isInputMaskFilled($event)"></p-inputMask>

<强> TS

@ViewChild('myInputMask') myInputMask: InputMask;

isInputMaskFilled(event) {
  if(!this.myInputMask.filled) {
    this.attr = { attributeValue: '' };
  }
}

请参阅StackBlitz

p-inputMask ng-model不清除无效值

1 个答案: