как использовать Azure Media Services в приложениях Angular 2+ - PullRequest
Новая
       51

как использовать Azure Media Services в приложениях Angular 2+

0 голосов
/ 14 декабря 2018

Я создал базовую настройку, как показано ниже

добавил эти CDNS в index.html 

<link href="//amp.azure.net/libs/amp/1.8.0/skins/amp- 
default/azuremediaplayer.min.css" rel="stylesheet">
<script src="//amp.azure.net/libs/amp/1.8.0/azuremediaplayer.min.js</script>

streaming.component.html 

 <video id="vid1" class="azuremediaplayer amp-big-play-centered amp-default-skin" crossorigin="anonymous" autoplay controls
         width="850" height="500">
        <p class="amp-no-js">
            To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video
        </p>
    </video>

streaming.component.ts 

ngAfterContentInit() {
 var myPlayer = amp('vid1');
 console.log(myPlayer.currentTechName(), 'texhname');
 myPlayer.autoplay(false);
 myPlayer.controls(true);
 myPlayer.src({
     type: "application/dash+xml",
     src: "//amssamples.streaming.mediaservices.windows.net/91492735-c523-432b-ba01-faba6c2206a2/AzureMediaServicesPromo.ism/manifest(format=mpd-time-csf)",
 });

}

добавил azuremediaplayer.d.ts в мою угловую папку src

изначально все работает нормально, когда мы переходим на любую страницу и возвращаемся, она получилапотерял как-то. пожалуйста, помогите мне в этом.Спасибо !!

1 Ответ

0 голосов
/ 16 декабря 2018

Я не знаю, как это сделать в Angular 2, но у меня есть пример в последней версии Angular 7. Вы также должны использовать последнюю версию проигрывателя AMP.1.8 сейчас довольно старый.

Посмотрите мой пример стекаблица здесь: https://stackblitz.com/edit/azure-media-player-ng7

Дайте мне знать, если это поможет.

- Джон Д.

...