在某些条件下对小数的角度输入验证

时间:2019-07-03 02:48:15

标签: angular ionic-framework

如果itemNew.UL_DATA和itemNew.LL_DATA等于0或“”,如何将输入限制为仅小数点后两位数字。

<ion-col col-2>     
    <input (keypress)="ShowKey();" 
           [style.display]="itemNew.UL_DATA=='0' && itemNew.LL_DATA=='0'?'none':'inherit'"   
           style="width: 100%;flex-grow: 1; align-self:  flex-end;" 
           type="text" placeholder="Actual After Value" 
           [(ngModel)]="itemNew.ACTUAL_VALUE_L" 
           name="ActualData" 
           id="ActualData">

</ion-col>

1 个答案:

答案 0 :(得分:1)

您可以通过以下方法实现它。

HTML

<form [formGroup]="myForm">
  <ion-col>     
    <input #num formControlName="number" />
    <span style="color:red" *ngIf="(
          myForm.get('number').hasError('pattern') &&
          myForm.get('number').touched)">Invalid input.</span>
  </ion-col>
</form>

TS

  myForm: FormGroup;
  numRegex = /^-?\d*[.,]?\d{0,2}$/;

  constructor() {
    this.myForm = new FormGroup({
      number: new FormControl('', [Validators.required, Validators.pattern(this.numRegex)])
    });
  }

StackBlitz Demo