stop closing the modal by clicking backdrop or outside the modal

问题

I have used one angular2 ng-bootstrap modal in our code.

I want the modal will not close when I click outside the modal. Currently the modal is getting closed while clicking outside.

In angular1 I used to do this by [keyboard]="false" [backdrop]="'static'". But this is time it is not working in angular2.

Here is my plunker

My Open method is as follows:

  open() {
    const modalRef = this.modalService.open(NgbdModalContent);
    modalRef.componentInstance.name = 'World';
  }

回答1:

As per the answer of @anshuVersatile, I understand we need to use some modal options.

Then I create a object of NgbModalOptions and pass it as second parameter of my open method and it works.

Code is as follows :

let ngbModalOptions: NgbModalOptions = {
      backdrop : 'static',
      keyboard : false
};
console.log(ngbModalOptions);
const modalRef = this.modalService.open(NgbdModalContent, ngbModalOptions);

Here is the updated plunker.

回答2:

$modal.open({
   // ... other options
   backdrop  : 'static',
   keyboard  : false
});

While you creating your modal you can specify its behavior:

回答3:

Though it is late still it might be helpful for somebody else facing the issue:

 const config: ModalOptions = {
                backdrop: 'static',
                keyboard: false,
                animated: true,
                ignoreBackdropClick: true,
                initialState: {
                  data1: 'new-user',
                  username: 'test'
                }
              };
              this.bsModalRef = this.modalService.show(MyComponent, config);

initialState object is used to pass data to modal.

来源：https://stackoverflow.com/questions/41438160/stop-closing-the-modal-by-clicking-backdrop-or-outside-the-modal

标签

angular

ng-bootstrap