Modales Fenster bleibt im Hintergrund (ngx-modal)

Question

Ich versuche ein Fenster modal mit ngx-Modul zu implementieren, aber wenn das Fenster geöffnet wird bleibt es im Hintergrund und der Bildschirm ist deaktiviert.

Hier ist mein Code:

<button md-raised-button color="primary" class="text-upper" (click)="firstModal.open()">Proveedor</button> 
<modal #firstModal> 
    <modal-header> 
     <h1>I am first modal</h1> 
    </modal-header> 
    <modal-content> 
     This modal has its own header, content and footer. 
    </modal-content> 
    <modal-footer> 
     <button class="btn btn-primary" click="firstModal.close()">okay!</button> 
    </modal-footer> 
</modal> 
<button md-raised-button color="primary" class="text-upper">Marca</button> 
</div> 

Image

With opacity:0

Dank.

Answer 1

Sie sollten opacity:0 CSS-Eigenschaft verwenden, wie unten

import {ModalModule} from "ngx-modal"; 
@Component({ 
    selector: 'my-app', 
    template: ` 
    <div [class.disable]="disable"> 
     <h2>Hello {{name}}</h2> 
     <div class="row container-fluid"> 
     <img height="400" src="http://lorempixel.com/400/200"/><br><br> 
    <button (click)="openClicked()"> open my modal</button> 
    <br/><br/><br/><br/><br/><br/> 

    </div> 
</div> 
    <modal #myModal> 
     <modal-header> 
      <h1>Modal header</h1> 
     </modal-header> 
     <modal-content> 
      Hello Modal! 
     </modal-content> 
     <modal-footer> 
      <button class="btn btn-primary" (click)="closeClicked()">close</button> 
     </modal-footer> 
    </modal> 


    `, 
}) 
export class App { 
    @ViewChild('myModal') myModal; 
    name:string; 
    constructor() { 
    this.name = 'Angular2' 
    } 
    openClicked(){ 
    this.disable=true; 
    this.myModal.open(); 
    } 
    closeClicked(){ 
    this.disable=false; 
    this.myModal.close(); 
    } 
} 

LIVE DEMO