forma dinámica angular propiedad de entrada observables siempre nula

Chris Pickford:

Estoy enseñando a mí mismo en formas reactivas angular y se han quedado atascadas después de la guía de formularios dinámicos .

En el question.service.tsarchivo, he añadido un retraso a la volvieron observables para simular una solicitud HTTP:

return of(questions.sort((a, b) => a.order - b.order)).pipe(delay(10));

Este observables se pasa al app-dynamic-formcomponente de la app-rootplantilla:

<app-dynamic-form [questions]="questions$ | async"></app-dynamic-form>

Sin embargo, el questionsvalor de la propiedad de entrada parece estar siempre nula.

ERROR TypeError: No se puede leer la propiedad 'forEach' de null en QuestionControlService.toFormGroup (pregunta-control.service.ts: 19) en DynamicFormComponent.ngOnInit (dinámico-form.component.ts: 22)

La eliminación de los .pipe(delay(10))rendimientos del ejemplo a un estado de trabajo.

¿Alguien puede explicar por qué la questionspropiedad de entrada es nulo?

Ver StackBlitz por ejemplo, trabajando.

Chellappan வ:

Que está recibiendo el error porque la propiedad de entrada unión está sucediendo asynchronusly.

Prueba esto:

    <div>
        <ng-container *ngIf="questions$ | async as questions">
         <app-dynamic-form [questions]="questions"></app-dynamic-form>
        </ng-container>
    </div>