Свойство addControl не существует для типа AbstractControl

У меня есть вложенная FormGroup, которая выглядит так:

this.formGroup: FormGroup: {
    // ...
    controls: {
        "GENERAL_AND_PERSONAL_QUESTIONS": { // FormGroup object... }
    }
}

В FormGroup верхнего уровня я легко могу добавить такие элементы управления:

this.formGroup.addControl(tab.id, this.formBuilder.group({}));

Однако в дочернюю formGroup я по какой-то причине не могу добавить никаких элементов управления. Я пытаюсь добавить их вот так:

// tab.id = "GENERAL_AND_PERSONAL_QUESTIONS";
this.formGroup.get(tab.id).addControl(segment.id, this.formBuilder.group({}));

Но он всегда выдает ошибку компиляции, говоря:

Property 'addControl' does not exist on type 'AbstractControl'.

Любая помощь приветствуется :)


typescript angular angular-reactive-forms
person dave0688    schedule 29.11.2017    source источник
comment
На мой взгляд, эти два объекта формы вообще не совпадают. Где controls и GENERAL_AND_PERSONAL_QUESTIONS, когда вы пытаетесь добавить элемент управления? Что вообще такое formGroup, я не вижу там смысла в FormBuilder? :)   -  person AJT82    schedule 03.12.2017

Ответы (1)


arrow_upward
5
arrow_downward

FormGroup расширенный класс из AbstractControl имеет addControl, и этот метод не является частью родительского класса AbstractControl. Поэтому, когда вы используете метод get, возвращаемый элемент - это AbstractControl, а не FormGroup, поэтому вы должны убедиться, что возвращаемый элемент - это FormGroup, и правильно его привести, чтобы использовать метод addControl.

Имея это в виду, вы можете использовать addControl, добавив в свой код что-то вроде этого:

abstractControl : AbstractControl = this.formGroup.get(tab.id);
if(abstractControl instanceof FormGroup){
    (<FormGroup>abstractControl).addControl(segment.id, this.formBuilder.group({}));
}

Я сделал этот плункер, чтобы прояснить и проиллюстрировать то, что я имею в виду в приведенном выше коде. Пример находится в тестовом методе в src / app.ts

person JTejedor    schedule 29.11.2017
comment
Проблема в том, что это дает мне ошибку компиляции, поэтому .addControl просто не работает, даже с приведением ... - person dave0688; 29.11.2017
comment
Нет, теперь это еще один: ´this.formGroup.addControl (tab.id, this.formBuilder.group ({})); ´ теперь выдает следующую ошибку: ERROR TypeError: Cannot read property 'enabled' of undefined - person dave0688; 29.11.2017
comment
Я обновляю ответ, чтобы связать плункер, вы можете увидеть приведение и метод проверки в src / app.ts. Я надеюсь, что это разрешит любые твои сомнения - person JTejedor; 29.11.2017
comment
@ dave0688 это очередная ошибка, не связанная с вопросом. Не могли бы вы обновить вопрос, чтобы прояснить эту новую ошибку? - person JTejedor; 29.11.2017