Angular 验证器最小长度表单组反应式表单
我试图验证Angular 验证器最小长度表单组反应式表单,angular,validation,typescript,angular-reactive-forms,Angular,Validation,Typescript,Angular Reactive Forms,我试图验证minLength但它无法识别,因为我正在使用函数。我也曾在模板中直接尝试过,但没有得到任何结果 myComponent.html <mat-form-field> <input matInput placeholder="Ingresa tu celular" type="number" formControlName="celular"> <mat-error *ngIf="forma.controls['celular'].inval
minLength
但它无法识别,因为我正在使用函数。我也曾在模板中直接尝试过,但没有得到任何结果
myComponent.html
<mat-form-field>
<input matInput placeholder="Ingresa tu celular" type="number" formControlName="celular">
<mat-error *ngIf="forma.controls['celular'].invalid">{{ errorCelular() }}</mat-error>
</mat-form-field>
minLength
在早期版本的angular withtype=“number”
中不起作用。检查原因
如果不需要输入type=“number”
,请将其更改为type=“text”
,它应该可以工作。如果需要数字类型,则应使用自定义验证器检查数字是否大于最小9位数字(100000000)
然后像-celular:[''[Validators.required,customMinValidator]]
注:以上只是“如何”使用它的一个例子。它不会完全按照预期工作,因为对于像000112313这样的数字,条件会失败,它的minLength为9。但这应该会让您对如何解决这个问题有一个合理的想法。
minLength
在早期版本的angular withtype=“number”
中不起作用。检查原因
如果不需要输入type=“number”
,请将其更改为type=“text”
,它应该可以工作。如果需要数字类型,则应使用自定义验证器检查数字是否大于最小9位数字(100000000)
然后像-celular:[''[Validators.required,customMinValidator]]
注:以上只是“如何”使用它的一个例子。它不会完全按照预期工作,因为对于像000112313这样的数字,条件会失败,它的minLength为9。但这应该会让你对如何处理它有一个公平的想法。你能展示整个表单吗?是必需的工作吗?你能展示整个表单吗?是必需的工作吗?这是一个很大的帮助,我不知道minLength不适用于类型编号。实际上,如果我把它改为文本,如果它能工作,但我需要它是一个数字。我将尝试这个函数并尝试实现它。这是一个很大的帮助,我不知道minLength不能与number类型一起工作。实际上,如果我把它改为文本,如果它能工作,但我需要它是一个数字。我将尝试这个函数并尝试实现它。
celular: [ '', [Validators.required, Validators.minLength(9)] ],
errorCelular() {
return this.forma.controls.celular.hasError('required') ? 'El celular es necesario.' :
this.forma.controls.celular.hasError('minlength')? 'Mínimo 9 caracteres': '';
}
import { AbstractControl } from '@angular/forms';
function customMinValidator(control: AbstractControl): { [key: string]: boolean } | null {
if (control.value !== undefined && (isNaN(control.value) || control.value >= 100000000 )) {
return { 'customMin': true };
}
return null;
}