При импорте ReactiveFormsModule во вложенный импортированный модуль происходит сбой приложения

Question

Я использую модуль с общими компонентами, которые я использую во всем приложении, назовем его SharedModule. Так что до сих пор все работало отлично, но я добавил компонент в SharedModule, который использует форму, поэтому я добавил ReactiveFormsModule в импорт SharedModule. Именно тогда я получаю непонятную ошибку в другом модуле, который импортирует SharedModule, который также имеет форму, и поэтому он также импортирует ReactiveFormsModule. Ошибка следующая:

ERROR Error: Uncaught (in promise): Error: formControlName must be used with a parent formGroup directive.  You'll want to add a formGroup

Я попытался удалить ReactiveFormsModule из более позднего модуля, но затем он показывает ошибку, говорящую, что formgroup является неизвестным атрибутом формы, который переводится в ReactiveFormsModule, необходим.

Итак, мой SharedModule выглядит так:

@NgModule({
  imports: [CommonModule, TranslateModule.forChild(), IonicModule, ReactiveFormsModule], <-- ReactiveFormsModule import
  declarations: [
    FooterComponent,
    HeaderComponent,
    NoContentComponent,
    ModalLiveDeploy,
    PickerDirective,
    SelectComponent,
    InputComponent,
    RadioGroupComponent,
    CardComponent,
    SliderComponent,
    AccordionComponent,
    RadioComponent,
    CmbModalComponent <-- this is the one with the form in it
  ],
  entryComponents: [ModalLiveDeploy, CmbModalComponent],

А другой модуль, который показывает ошибку, выглядит примерно так:

@NgModule({
  declarations: [MainComponent], <-- this component has a form
  imports: [
    CommonModule,
    IonicModule,
    RouterModule.forChild(routes),
    TranslateModule.forChild(),
    SharedModule, <-- SharedModule which also imports ReactiveFormsModule 
    ReactiveFormsModule <-- ReactiveFormsModule import
  ]
})

Перед добавлениемконфликтующий компонент для SharedModule и ReactiveFormsModule, он работал как чудо, поэтому я думаю, что отображаемая ошибка не связана. Есть идеи, почему это может происходить?

Answer 1

Я обнаружил ошибку, в случае, если это поможет кому-нибудь в будущем:

Так что проблема заключалась в том, что я фактически использовал атрибут formControlName без использования formGroup, но это было в старом компоненте из SharedModule, а не вновый. Раньше он не вызывал никаких флагов, потому что я не импортировал ReactiveFormsModule в SharedModule, после того, как я это сделал, произошел сбой, дело в том, что трассировка ошибок указывала на другой модуль, в котором я использовал компонент с указанной ошибкой, который былчто сводило меня с ума.

Подводя итог, если вы добавите ReactiveFormsModule в модуль и вдруг увидите такую ​​ошибку, убедитесь, что вы проверили все компоненты, даже те, которые не были изменены внекоторое время.