Форма и проверки |
Как работает пользовательская проверка в Angular2+?
Ну очень просто! Прежде чем углубиться внутрь, давайте разберемся, как работает форма в Angular.
Мы можем создать два типа форм в любом угловом приложении.
1- Формы, управляемые шаблоном
2- Модульные формы, часто называемые реактивными формами.
Формы на основе шаблонов
Поскольку имя указывает на то, что управляется шаблоном. Эти формы были довольно распространены в версиях AngularJs. Форма — это объект, который инкапсулирует элементы управления формой и имеет собственное состояние.
Когда я говорю, что форма имеет состояние, я имею в виду, что в любой момент времени форма может иметь такие состояния, как Грязный, Нетронутый, Тронутый, Нетронутый и т. д., а также
в нем зарегистрированы некоторые элементы управления формой, которые являются не чем иным, как еще одним объектом, отслеживающим состояние и действительность элементов и формы.
В форме, управляемой шаблоном, мы не создаем объект Form и Form-Controls вручную, вместо этого Angular Compiler делает это за нас.
Создание объектов управляется шаблоном
для меня —
<тело>
форма>
**
Вот как мы создаем объект вручную*
пользователь: FormGroup;
this.user = this.fb.group({
имя пользователя: [‘DefaultValue’, Validators.required, Validators.maxLength(20)]
});
В коде выше
1: Мы создали форму с именем пользователь.
2: Создан элемент управления формой с именем имя пользователя
3: Зарегистрированы два валидатора с formcontrol, которые Validators.required, Validators.maxLength(20)
Если вы внимательно посмотрите на синтаксис HTML, вы обнаружите, что мы не написали никакой специальной директивы внутри тега ввода, как мы это сделали в форме, управляемой шаблоном.
Шаблон не берет на себя ответственность за создание какого-либо объекта, все, что нам нужно сделать, это позаботиться о логике проверки и состоянии формы.
Пожалуйста, не стесняйтесь исправлять любые ошибки, спасибо за чтение.