#javascript #angular #typescript #reactive-forms
#javascript #angular #машинописный текст #угловые реактивные формы
Вопрос:
У меня есть форма, которая разделена на компоненты, и поэтому мне нужно использовать .addControl
, чтобы заставить форму работать вместе.
На данный момент это структура формы:
name: ['', [Validators.required, Validators.maxLength(255)]],
address: this.ofb.group({
addressLineOne: ['', Validators.required],
addressLineTwo: ['', Validators.required],
addressLineThree: [''],
addressPostcode: ['', [Validators.required, OrgValidators.postcodeValidator]]
})
Я преобразовал поля в .addControl
синтаксис следующим образом:
this.createOrganisationForm.addControl('name', new FormControl(null, [Validators.required, Validators.maxLength(255)]));
this.createOrganisationForm.addControl('addressLineOne', new FormControl(null, [Validators.required]));
this.createOrganisationForm.addControl('addressLineTwo', new FormControl(null, [Validators.required]));
this.createOrganisationForm.addControl('addressLineThree', new FormControl(null, [Validators.required]));
this.createOrganisationForm.addControl('addressPostcode', new FormControl(null, [Validators.required, OrgValidators.postcodeValidator]));
Однако, похоже, они теряют ‘адрес’ группы. Я попытался добавить адрес в объект следующим образом:
let addressGroup = {
addressLineOne: ['', Validators.required],
addressLineTwo: ['', Validators.required],
addressLineThree: [''],
addressPostcode: ['', [Validators.required, OrgValidators.postcodeValidator]]
}
а затем добавьте ее вот так:
this.createOrganisationForm.addControl('address', addressGroup);
но я получаю ошибку:
не может быть присвоен параметру типа ‘AbstractControl’.
Как мне добавить группу элементов управления к родительскому элементу управления с помощью .addControl
метода.
Спасибо
Ответ №1:
Инициализируйте свою addressGroup типом FormGroup
, как указано ниже:
пусть addressGroup = {
let addressGroup: FormGroup = new FormGroup({
Ответ №2:
Это потому, что объект addressGroup не является экземпляром класса FormGroup.
const addressGroup = new FormGroup({
addressLineOne: ['', Validators.required],
....
})