I want to update the form value from the child component. Here is the parent component:

app.component.ts

ngOnInit() {
  this.form = this.fb.group({
     priority: [this.editPriority, Validators.nullValidator],
     . 
     .
     .
  });
 }

app.component.html

  <div *ngIf="editType === 'priority'">
    <app-child[form]="form"></app-child>
  </div>

child.component.ts:

export class ChildComponent implements OnInit {
  @Input() form: FormGroup;
  constructor() { }

  ngOnInit(): void {
  }

}

child.component.html:

  <div class="col-sm-2">
    <label for="priority"> Priority</label>
  </div>
  <div class="input-group col-sm-10">
    <input type="text" class="form-control" id="priority" name="priority" formControlName="priority"
           placeholder="priority">
  </div>

I tried like this stackBlitz but I got the below error:

TypeError: Cannot read properties of null (reading 'addControl')

I tried adding:

this.form.addControl('priority', new FormControl());

inside ngOnInitbut still I got the error.

Any suggestions for updating data through the child component?