Я пытался создать настраиваемую директиву проверки формы в Angular 8, и мне было интересно, можно ли получить доступ к атрибутам валидаторов FormBuilder, таким как Required/minLength/maxLength внутри моей директивы.
На данный момент я обрабатываю минимальные/максимальные значения ввода, вручную устанавливая атрибуты min/max для ввода HTML.
// form.component.html
<form
customFormValidation // my directive
class="form"
[formGroup]="userForm"
(ngSubmit)="onSubmit()">
<div class="form-group">
<label class="input-label">Username</label>
<input
type="text"
minlength="5"
maxlength="10"
formControlName="username"
name="username"
class="form-control"/>
...
</form>
// form.component.ts
ngOnInit() {
this.userForm = this.fb.group({
username: [
"",
[
Validators.required,
Validators.minLength(5),
Validators.maxLength(10)
]
]
});
}
// customFormValidation.directive.ts
...
constructor(private renderer: Renderer2, private el: ElementRef) {}
@HostListener("submit", ["$event"])
onSubmit(e) {
e.preventDefault();
this.isSumbited = true;
for (const formInput of e.currentTarget.elements) {
// For the simplicity of the example just logging the
minLength value of each input in the form
console.log(formInput.value.minLength);
}
}
Как видно выше, я обрабатываю входную минимальную/максимальную длину, обращаясь к атрибутам, представленным в html, но на самом деле я хочу получить доступ к минимальной/максимальной длине из валидаторов FormBuilder.
Любая помощь приветствуется.