javascript - open een bootstrap 3.3.7 modal met angular 6 viewchild

Ik heb een bootstrap-modal als volgt in mijn component.html

<div #myModall  class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

Ik ben het component.ts als volgt aan het openen.

 export class Component implements OnInit, AfterViewInit {
      @ViewChild('myModall') myModall: ElementRef;
  ngAfterViewInit() {

    this.myModall.nativeElement.modal('show');

  }
}

Ik heb toegang gekregen zoals vermeld in de Bootstrap 3.3.7-documentatie in deze link https://getbootstrap.com/docs/3.3/javascript/#modals Nu krijg ik een foutmelding als volgt: this.myModall.nativeElement.modal is geen functie. Heeft iemand suggesties over hoe je een modal vanuit een TypeScript-bestand kunt openen en hoe je dit op de juiste manier kunt doen??????