ngx-bootstrap错误TypeError：_co.openModal不是函数

Question

I'm new with ngx-bootstrap, and i try to make modal from this site : https://valor-software.com/ngx-bootstrap/#/modals

this i got this error: ERROR TypeError: _co.openModal is not a function

here is some snippets

 //app.component.ts file import { Component } from '@angular/core'; import { TemplateRef } from '@angular/core'; import { BsModalService } from 'ngx-bootstrap/modal'; import { BsModalRef } from 'ngx-bootstrap/modal/modal-options.class'; @Component({ selector: 'app-root', styleUrls:['app.component.css'], templateUrl:'app.component.html', //template:`<h1>Hello world</h1>` }) export class AppComponent { title = 'ini tengah'; } export class DemoModalServiceStaticComponent { public modalRef: BsModalRef; constructor(private modalService: BsModalService) {} public openModal(template: TemplateRef<any>) { this.modalRef = this.modalService.show(template); } } 

 <!--the HTML file--> <!--call modal--> <li><a href="#" (click)="openModal(template)">BUTTON</a></li> <!--end--> <!--Modal--> <template #template> <div class="modal-header"> <h4 class="modal-title pull-left">Modal</h4> <button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body"> This is a modal. </div> </template> <!--enf of modal--> 

I followed the website then just got that error. Can anyone help me fix this error?

Plase let me know when more snippets is needed, Thank you in advance :)

Answer 1

Try like this :

write openModal method inside the Appcomponent

export class AppComponent {
  title = 'ini tengah';
  public modalRef: BsModalRef;
  constructor(private modalService: BsModalService) {}

  public openModal(template: TemplateRef<any>) {
    this.modalRef = this.modalService.show(template);
  }
}