beenden schließen des modal, indem Sie auf hintergrund oder außerhalb des modal

Benutzt habe ich eine angular2 ng-bootstrap modal in unserem code.

Ich will das modal wird nicht schließen, wenn ich Sie außerhalb des modalen. Derzeit modal ist immer geschlossen, während Sie außerhalb.

In angular1 ich verwendet, um zu tun dies, indem Sie die [keyboard]="false" [hintergrund]="'statische'". Aber dies mal ist es nicht die Arbeit in angular2.

Hier ist mein plunker

Meine Open-Methode ist wie folgt:

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

InformationsquelleAutor Partha Sarathi Ghosh | 2017-01-03

  1. 30

    Als pro die Antwort von @anshuVersatile, ich verstehen, müssen wir nutzen, um einige modale Optionen.

    Dann Erzeuge ich ein Objekt der NgbModalOptions und übergeben Sie als zweiten parameter meiner open-Methode, und es funktioniert.

    Code ist wie folgt : 

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

    Hier ist die aktualisierte plunker.

    Beachten Sie, dass es eine ähnliche, aber völlig unabhängig angular bootstrap-Bibliothek 'ngx-bootstrap". Die Optionen, die Sie benötigen, um unterscheiden dieser - siehe valor-software.com/ngx-bootstrap/#/.... Sie müssen let config = { backdrop: true, ignoreBackdropClick: true }; dann ... this.modalService.show(SomeComponent, config);
    loading... in plunker => Fehler {originalErr: Fehler constructor: Object}

    InformationsquelleAutor Partha Sarathi Ghosh

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

    Während Sie die Erstellung Ihrer modalen können Sie angeben, Ihr Verhalten:

    Ist es Angular2 code? Ich denke nicht so. Ich erwarte Angular2 code.
    Ja, das ist Angular-code (in der Tat ist es nur JavaScript-Optionen ng-bootstrap-modal-service sind nur ein Objekt-literal). Als der Autor dieser Komponente kann ich auch sagen, dass es eine richtige Antwort und sollte akzeptiert werden. Gute Arbeit @anshuVersatile
    Ich bin mit Typoskript und Angular2 hier, nicht JavaScript.

    InformationsquelleAutor anshuVersatile

  3. 0

    Aber es ist zu spät, noch könnte es hilfreich sein, für jemand anders vor der Frage:

     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-Objekt wird verwendet, um die übergabe von Daten an modalen.

    InformationsquelleAutor Anuj Shukla

Schreibe einen Kommentar