web-dev-qa-db-ja.com

背景またはモーダルの外側をクリックして、モーダルの終了を停止します

コードでは、angular2 ng-bootstrap modalを1つ使用しました。

モーダルの外側をクリックしても、モーダルが閉じないようにします。現在、外側をクリックするとモーダルが閉じられます。

Angular1では、[keyboard] = "false" [backdrop] = "'static'"でこれを行っていました。しかし、今度は、angular2で動作していません。

これが私の plunker です

私のOpenメソッドは次のとおりです。

  open() {
    const modalRef = this.modalService.open(NgbdModalContent);
    modalRef.componentInstance.name = 'World';
  }
angularng-bootstrap
10
Partha Sarathi Ghosh

@anshuVersatileの回答によると、いくつかのモーダルオプションを使用する必要があることを理解しています。

次に、 NgbModalOptions のオブジェクトを作成し、openメソッドの2番目のパラメーターとして渡します。

コードは次のとおりです。

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

これが更新された plunker です。

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

モーダルの作成中に、その動作を指定できます。

5
anshuVersatile

まだ遅いですが、問題に直面している他の誰かにとっては役立つかもしれません：

 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オブジェクトは、データをモーダルに渡すために使用されます。

2
Anuj Shukla