我有一种情况,我需要格式化用户输入,然后验证它.
我正在使用反应式表单并创建我的自定义验证,如下所示(相关部分):
HTML:
<input type="text" formControlName="invoiceNumber" (blur)="formatInvoiceNumber()" class="form-control"> <div *ngIf="this.form.controls['invoiceNumber'].invalid && this.form.controls['invoiceNumber'].touched">Invalid Text</div>
控制器:
this.form = this.formBuilder.group({ 'invoiceNumber': ['',validateInvoiceNumber()],}); formatRoNumber() { var invoiceNumber = this.form.controls['invoiceNumber'].value; //format invoice number }
验证器:
export function validateInvoiceNumber(): ValidatorFn { return (control: AbstractControl): { [key: string]: any } => { let invoiceNumber = control.value,isValid = true; //validate invoice number return isValid ? null : { validInvoiceNumber: { valid: false } } }; }
我遇到了计时问题.输入格式化在验证后发生.
如何告诉Angular应用格式然后验证?
解决方法
如果您还使用ngModel进行格式化,则可以使用formbuilder执行此操作.我已经完成了它
<ion-input formControlName="fullName" type="text" [ngModel]="fullName | pipeHere" (ngModelChange)="fullName=$event"> </ion-input> this.customerFields = this.fb.group({ fullName: ['',Validators.compose([ Validators.required,Validators.minLength(11) ])] });
(ngModelChange)将像往常一样在验证时激活管道.如果您编写自定义管道,则还可以进行其他验证.