AngularJS ngInclude Html5 视频没有被替换答案

【问题标题】：AngularJS ngInclude Html5 Video doesn't get replacedAngularJS ngInclude Html5 视频没有被替换
【发布时间】：2015-02-19 13:48:27
【问题描述】：

我的问题：ngInclude 视频源不会替换视频。

我的页面有一个提要和一个预览，每次我点击提要中的帖子时，它的预览都会被注入 (ngInclude) 到预览区域。它适用于 youtube 视频、图像和文本，但当它进入 html5 视频时，相同的视频会继续显示，并且页面中的源似乎没有被替换。

最奇怪的是，当我进入 chrome 调试器并检查元素时，我看到它的源代码被替换为不同的 url，但预览中的视频并没有改变。

我什至尝试启用自动播放，当我浏览帖子时，视频继续流畅播放。

以下是相关代码位：

获得 ngInclude 的预览：

<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

有人遇到过类似的事情吗？我应该以某种方式刷新视频源吗？如果是的话怎么办。

谢谢！

【问题讨论】：

您是否在控制台中遇到任何错误？你能创建一个小提琴/plunkr吗？
我试过了，但我不知道如何将视频网址放在那里，我遇到了一些安全错误。 jsfiddle.net/h5aac/88

标签： javascript angularjs html video angularjs-ng-include

【解决方案1】：

尝试在视频源标签中使用 ng-src 代替 src

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

这让 Angular 知道 src 将被替换并获取结果

【讨论】：

感谢回复，还是不行。在元素检查中，我现在得到了 ngSrc 和 src，它们都指向相同的 url，当我选择不同的帖子时会发生变化，但仍然是相同的视频，当我注入不同的 html 时仍然会继续播放

【解决方案2】：

最终解决这个问题的是删除视频标签内的源标签并直接更改视频的“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>

【讨论】：