Open ng-bootstrap modal programmatically

Question

I\'ve got an angular 4 page including a ng-bootstrap modal. My code looks like this.

foo.html

[...]


        

Answer 1

from Angular 8 you should also pass static option: {static: false} in ViewChild

import { ViewChild } from '@angular/core';

@ViewChild('content', { static: false }) private content;

constructor(private modalService: NgbModal) { }

this.modalService.open(this.content);

Answer 2

To access the content element inside the class, declare:

@ViewChild('content', { static: false }) private content;
                         ^for Angular8+

and add the corresponding import at the top of the class:

import { ViewChild } from '@angular/core';

and finally call open method for that element on change detection:

ngOnChanges(changes: any) {
   this.open(this.content);
}