1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. Anuncie Aqui
    Anuncie aqui você Também: fdantas@4each.com.br

Angular 6 nested ViewChild inside ng-template is null

Discussão em 'Angular' iniciado por ewulff, Outubro 10, 2024.

  1. ewulff

    ewulff Guest

    We are using a modal (ng-bootstrap's one) in our application. That modal looks like:

    <ng-template #modal let-modal>
    <app-audio #audio></app-audio>
    </ng-template>


    And it's logic:

    @ViewChild('modal')
    modal: ElementRef;

    @ViewChild('audio')
    audio: AudioComponent;


    The modal is opened with:


    this.modalService.open(this.modal, { size: 'lg' });
    ​

    Everything fine till here. The modal opens and the audio component is shown. But now, we want to access the logic that is inside the component, and when doing something like:


    this.audio.somePublicComponentFunction()
    ​

    It happens that this.audio is null. I have already tried to get the child with angular's change detector, but cannot find a way to properly link this.audio with the actual component. Any ideas? Thanks a lot.

    You can see the issue here: stackblitz.com/edit/angular-ofmpju

    Continue reading...

Compartilhe esta Página