Quiero actualizar el valor del formulario del componente secundario. Aquí está el componente principal:
aplicación.componente.ts
ngOnInit() { this.form = this.fb.group({ priority: [this.editPriority, Validators.nullValidator], . . . }); }aplicación.componente.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 { } }niño.componente.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>Intenté como este stackBlitz pero obtuve el siguiente error:
TypeError: no se pueden leer las propiedades de nulo (leyendo 'addControl')
Intenté agregar:
this.form.addControl('priority', new FormControl()); dentro ngOnInit pero aún así recibí el error.
¿Alguna sugerencia para actualizar los datos a través del componente secundario?
Farzán. Uso emisores de eventos angulares, donde el niño llama a una función en el padre (o viceversa) cuando es necesario. Esta función existe en el padre o hijo y se llama cuando es necesario, incluida la capacidad de pasar parámetros. No estoy seguro de si funciona para su situación, pero sé que funciona bastante bien para mí muy a menudo.
Aquí hay un ejemplo simple: Pasar evento del componente secundario al componente principal Angular 5