Поймайте YouTube, встраивайте видео события в приложение ionic 3

В моем ионном приложении я перечислил встроенные видео YouTube следующим образом:

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

video.url генерируется из приведенной ниже функции

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

Он работает нормально, но я также хочу фиксировать такие события, как приостановка, завершение или начало воспроизведения видео на YouTube и т. д. Я попытался импортировать это http://brandly.github.io/angular-youtube-embed/#/ и использовать его с моим приложением ionic3, но это дает ошибку "угловой не определен '. Ionic использует угловой, но может быть он использует его по-другому, что генерирует ошибку, не определяемую угловым.

Спасибо за помощь.


typescript ionic-framework angular ionic3 youtube
person Sohail    schedule 26.08.2017    source источник
comment
Почему нельзя использовать тег html5 video?   -  person Sampath    schedule 26.08.2017
comment
@Sampath Я хочу использовать видео с YouTube.   -  person Sohail    schedule 26.08.2017
comment
Здравствуйте, вы решили это? У меня та же проблема, встроенное видео на Youtube работает нормально, но мне нужны команды, чтобы остановить или приостановить его, если пользователь переходит на другую страницу. Любой намек? @Сампат   -  person skinny_jones    schedule 18.05.2018

Ответы (1)


arrow_upward
1
arrow_downward

Вам не нужно использовать встроенные фреймы YouTube в своем приложении ionic. Вы можете использовать < strong>нативный плагин Youtube Video Player.

Воспроизведение видео с YouTube в собственном видеоплеере на Android и iOS

Плагин ionic cordova добавить Cordova-plugin-youtube-video-player

npm install --save @ionic-native/youtube-video-player

.ts

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

constructor(private youtube: YoutubeVideoPlayer) { }

this.youtube.openVideo('myvideoid');

В app.module.ts также импортируйте YoutubeVideoPlayer и добавьте его в раздел провайдеров.

Это репозиторий Git. Перейдите по этой ссылке, чтобы получить дополнительные инструкции, включая добавление ключа API YouTube.

person Sampath    schedule 26.08.2017
comment
Спасибо, а родной плеер значит будет открывать видео в приложении ютуб? - person Sohail; 26.08.2017
comment
Он воспроизводит видео с Youtube в собственном видеоплеере на Android и iOS. - person Sampath; 26.08.2017
comment
Большое спасибо Sampath, теперь видео воспроизводится намного лучше, но моя проблема все еще существует, я не могу запустить функцию, когда видео останавливается. Вы предлагаете что-нибудь для этого? - person Sohail; 29.08.2017
comment
В этом родном плагине такого метода нет. - person Sampath; 19.11.2017