Angular 2-Bindung an modal engen Ereignisse

Welches ist der richtige Weg ist, ein Youtube-Video eingebettet in Angular 2 zu stoppen?Angular 2-Bindung an modal engen Ereignisse

Wie in AngularJS, scheint die beste Lösung JQuery wurde mithilfe der iframe src der Eigenschaft ändern, aber dies ist in Angular2 vermeiden werden. Stop Youtube video after modal close

In angular 2, ich bin nicht zu manipulieren die Dom, so dass meine eingebettete iframe seine src Eigenschaft aus einer Variablen in meiner Komponente. Wenn ich diese Eigenschaft aufheben möchte, wird das Video erwartungsgemäß nicht mehr abgespielt.

Also, die (close) auf die Schaltfläche Bindung funktioniert gut, aber es spielt nicht mehr, wenn ich außerhalb des modalen klicken.

Ich habe versucht (close), zu binden (hide), (hidden) und (dismiss) in meinem modal <div>, aber keiner von ihnen arbeitet.

Ich frage mich, ob so etwas wie dies möglich ist:

<div (hide)="stopVideoPlayer()" class="modal fade" id="modal-video" tabindex="-1" role="dialog" aria-labelledby="modal-video" aria-hidden="true"> 
     <button (click)="stopVideoPlayer()" type="button" class="close" data-dismiss="modal"> 
      <span aria-hidden="true">&times;</span> 
     </button> 
     </div> 
     <div class="modal-body"> 
     <div class="modal-video"> 
      <iframe id="video-player" width="640" height="480" class="embed-responsive-item" [src]="selectedVideo" frameborder="0"></iframe> 
      </div> 
     </div> 
    </div> 
    </div> 
</div>

Quelle

2017-05-21 luso

Wenn Sie außerhalb Modal klicken, wird es geschlossen? –

yep, es schließt nomally – luso

Können Sie eine plunkr erstellen? –

Sie sollten (onHidden) werden, der ausgelöst wird, nachdem die modale versteckt ist und alle CSS-Übergänge sind abgeschlossen. Senden Sie den Wert in dieser Methode.

<div (onHidden)="afterHidden($event)"> </div>

Quelle

2017-05-21 12:39:15 Aravind

scheint nicht zu funktionieren ... Ich habe versucht (versteckt) und (onHidden), aber keiner von ihnen löst meine Funktion aus. – luso

, was Sie aktualisieren den Code zu Ihrem Beitrag – Aravind

gut, versuchten versuchte ich, was schon für versteckte angegeben und Ihren Vorschlag, aber keiner von ihnen arbeitet bisher – luso

Angular 2-Bindung an modal engen Ereignisse

Antwort

Verwandte Themen