更改视频源 HTML

Question

所以我有以下 html 代码。

<div class="panel">
        <div class="col-sm-9">>
            <video id="currentVideo" width="650" height="350" controls>
              <source src="{{currentVideo.Source}}" type="video/mp4">
              Your browser does not support the video tag.
            </video>
        </div>
        <div class="col-sm-3" ng-click="showVideo(video)">
            <ul ng-repeat="video in videoHelpFiles" id="playlist">
                <div ng-click="showVideo(video)">
                    <span><h4> {{video.Title}} </h4></span>
                    <span><p> {{video.Description}} </p></span>
                    <br>
                </div>
            </ul>
        </div>
    </div>

这是我的咖啡脚本。

.controller 'HelpCtrl', (
    $scope

) ->
    $scope.videoHelpFiles = [
            Title: "Video 1"
            Description: "Desc 1"
            Source: '../../videos/video1.mp4'
        ,
            Title: "Video 2"
            Description: "Desc 2"
            Source: '../../videos/video2.mp4'
        ]

    $scope.currentVideo = $scope.videoHelpFiles[0]

    $scope.showVideo = (video) ->
        $scope.currentVideo = video

我的问题是如何在点击时更改视频。当我使用 iFrame 而不是视频时，此代码有效，显然我不想这样做，但谁能解释为什么当我尝试使用视频标签时这不起作用？

Answer 1

我也有类似的问题...试试这个方法：

<video id="currentVideo" src="{{currentVideo.Source}}" width="650" height="350" controls>
    Your browser does not support the video tag.
</video>

它对我有用。

Answer 2

首先，你的 showVideo(video)

   <div class="col-sm-3" ng-click="showVideo(video)">

video 实例不在 ng-repeat 范围内。我将向 showVideo 函数发送未定义的引用