<video> 动态更新 的 src 不会更改视频

Question

我有一个附件数组，我有一个功能可以浏览它们并根据其源URL显示/播放视频。我已正确更新 URL，但网站上的实际视频输出没有更改。

下面是一个最小的示例 HTML：

<ng-container *ngIf="isVideo; then videoFile; else notVideoFile"></ng-container>
<ng-template #videoFile>
<video controls autoplay>
<source [src]="currentAttachment.url"/>
</video>
</ng-template>

我肯定知道URL会更新，因为当我{{ currentAttachment.url }}打印它时，它很好。网址会更新，但实际视频不会更新。

Answer 1

我找到了解决方案。在遍历我的附件数组时，我添加了以下代码来更新 src：

if (this.isVideo) {
if (this.videoFileContainer) {
this.videoFileContainer.nativeElement.load();
this.videoFileContainer.nativeElement.play()
}
}

并添加了视图子项：

@ViewChild('videoFileContainer', { static: false }) videoFileContainer;

，然后更新 HTML：

<ng-template #videoFile>
<video #videoFileContainer controls autoplay>
<source [src]="currentAttachment.url"/>
</video>
</ng-template>

Answer 2

试试这个

<source src="{{currentAttachment.url}}" type="video/mp4" />

您正在执行一些语法错误

Answer 3

我不使用 angular 但是我知道您必须删除视频标签并使用新的 src 重新制作视频标签