角。错误无法读取 null 的属性（读取“addFormGroup”）答案

【问题标题】：Angular. Error Cannot read properties of null (reading 'addFormGroup')角。错误无法读取 null 的属性（读取“addFormGroup”）
【发布时间】：2022-01-20 00:56:52
【问题描述】：

我有一个带有表单的组件：

<form [formGroup]="Nsfg.invoiceFormGroup">
   <div formGroupName="namespace">
      <div class="accordion" id="accordionTrikititta">
         <newFacturaE></newFacturaE>
                  
         <fileHeaderComponent [invoiceFormGroup]="Nsfg.invoiceFormGroup">
         </fileHeaderComponent>
         ...

随着表单的增长，我需要将其拆分为不同的组件：第一个 'fileHeaderComponent'

在我的 Html 中的子组件中：

<div formGroupName="FileHeader">             
             <div class="form-inline">
 ....

然后我收到一个错误：

ERROR TypeError: Cannot read properties of null (reading 'addFormGroup')

并且正在调试它，因为没有找到元素的父级......它应该在哪里找到它的父表单它是空的。

我一直在尝试在这里找到的一些解决方案（没有运气）：

https://stackblitz.com/edit/angular-2b3zcz?file=src%2Fapp%2Faddress%2Faddress.component.html



https://stackblitz.com/edit/angular-ewdzmp?file=src%2Fapp%2Fcomponent%2Ffamily%2Ffamily.component.ts

【问题讨论】：

您可以参考下面的链接了解父子组件中的反应形式。 blog.profanis.me/blog/reactive-forms-in-parent-child-components
谢谢！该博客中的信息更清晰......我有一个不同的场景，但它真的很有帮助！
如果您觉得真的很有帮助，请为 cmets 点赞。这样我才能获得足够的声望。
对不起，我没有那个选项！（？？？）也许你可以创建一个答案...我有一个投票答案的按钮，但只有 cmets 的一个标志。
完成我已经添加了答案。谢谢

标签： angular forms parent-child

【解决方案1】：

感谢 Jai Saravanan！

在我的情况下，我是这样解决的：

父 html（引用子）：

<form [formGroup]="Nsfg.invoiceFormGroup">
   <div formGroupName="namespace">
     <fileHeaderComponent formGroupName="FileHeader"></fileHeaderComponent>

html 孩子：

<div [formGroup]="fileHeaderFormGroup">

ts 孩子：

export class FileHeaderComponent implements OnInit {      
  @Input() formGroupName: string;

ngOnInit(): void {
    this.fileHeaderFormGroup = NsGet.fileHeader as FormGroup;
  }

NsGet 等于

 Nsfg.invoiceFormGroup.get('namespace').get('FileHeader');

【讨论】：