AngularJS ngInclude Html5 Видео не заменяется

Моя проблема: ngIncluding источник видео не заменяет видео.

На моей странице есть канал и предварительный просмотр, каждый раз, когда я нажимаю на сообщение в канале, его предварительный просмотр вводится (ngInclude) в область предварительного просмотра. Он отлично работает для видео на YouTube, для изображений и для текста, но когда он доходит до видео в формате html5, одно и то же видео продолжает отображаться, и кажется, что источник не заменяется на странице.

Самое странное, когда я вхожу в отладчик Chrome и проверяю элемент, я вижу, что его источник заменяется другим URL-адресом, но видео в предварительном просмотре не меняется.

Я даже пытался включить автовоспроизведение, и когда я перемещаюсь по сообщениям, видео продолжает воспроизводиться плавно.

Вот соответствующие биты кода:

Предварительный просмотр, который получает ngIncluded:

<div ng-if="postInfo.Media.type == 'video'">
    <video name="media" width="582" height="582" controls autoplay>
        <source src="{{postInfo.Media.videoStandardResolution}}" type="video/mp4">
    </video>
</div>

Главная страница, включая бит:

<div id="preview-panel">
    <ng-include src="htmlInclude"  onload="responsiveCalc()"/>
</div>

И в моем javascript, когда я получаю сообщение об изменении сообщения в ленте, я просто повторно инициализирую $scope.htmlInclude

Кто-нибудь сталкивался с подобным? Должен ли я как-то обновить источник видео? И если да то как.

Спасибо!


javascript html angularjs video angularjs-ng-include
person AlexD    schedule 19.02.2015    source источник
comment
вы получили какую-либо ошибку в консоли? не могли бы вы создать скрипку / plunkr, пожалуйста?   -  person Pankaj Parkar    schedule 19.02.2015
comment
Я пытался, но понятия не имею, как вставить туда URL-адреса видео, я получаю какую-то ошибку безопасности. jsfiddle.net/h5aac/88   -  person AlexD    schedule 19.02.2015

Ответы (2)


arrow_upward
0
arrow_downward

Попробуйте использовать ng-src вместо src в теге источника видео.

<source ng-src="{{postInfo.Media.videoStandardResolution}}" type="video/mp4">

Это позволяет angular узнать, что src будет заменен, и получить результат.

person Joe Fitter    schedule 19.02.2015
comment
спасибо за ответ, это все еще не работает. При проверке элементов я теперь получил ngSrc и src, оба указывают на один и тот же URL-адрес и изменяются, когда я выбираю другой пост, но все еще то же видео и все еще продолжает воспроизводиться, когда я ввожу другой html. - person AlexD; 19.02.2015

arrow_upward
0
arrow_downward

В конечном итоге это решило удаление тега источника внутри тега видео и непосредственное изменение атрибута «src» видео.

Наткнулся на это: http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#the-source-element и оттуда это было довольно очевидно.

поэтому мой html теперь выглядит так:

<video name="media" width="582" height="582" controls autoplay src="{{postInfo.Media.videoStandardResolution}}">
    Your browser does not support the video tag.
</video>
person AlexD    schedule 22.02.2015