web-dev-qa-db-fra.com

Catch youtube intégrer des événements vidéo dans l'application ionic 3

Dans mon application ionique, j'ai répertorié les vidéos youtube incorporées comme suit:

<iframe allowfullscreen frameborder="0" height="200" width="100%" [src]="video.url">
      </iframe>

le video.url est généré à partir de la fonction ci-dessous

generateVideoUrl(videoId) {
    return this.sanitizer.bypassSecurityTrustResourceUrl("https://www.youtube.com/embed/" + videoId + "?rel=0&amp;showinfo=0");
  }

Cela fonctionne bien, mais je veux aussi capturer des événements tels que la vidéo youtube est en pause, ou se termine, ou commence à jouer, etc. J'ai essayé d'importer cette http://brandly.github.io/angular-youtube-embed/# / et l'utiliser avec mon application ionic3, mais cela donne une erreur 'angulaire n'est pas définie'. Ionic utilise angulaire, mais peut-être l’utilise-t-il différemment si une erreur angulaire non définie est générée.

Merci pour ton aide.

angulartypescriptionic-frameworkyoutubeionic3
6
Sohail

Vous n'avez pas besoin d'utiliser des images youtube intégrées sur votre application ionique. Vous pouvez utiliser plugin natif de Youtube Video Player .

Lire des vidéos Youtube dans un lecteur vidéo natif sous Android et iOS

ionic cordova plugin ajoute cordova-plugin-youtube-video-player

npm install --save @ ionic-native/lecteur-youtube

.ts

import { YoutubeVideoPlayer } from '@ionic-native/youtube-video-player';

constructor(private youtube: YoutubeVideoPlayer) { }

this.youtube.openVideo('myvideoid');

Dans app.module.ts, "importez" également YoutubeVideoPlayer et ajoutez-le dans la section "fournisseurs".

Il s’agit du Git repo . Veuillez consulter ce lien pour plus d’informations, notamment l’ajout d’une clé d’API YouTube.

1
Sampath