javascript - 与 Videogular 指令交互——如何操作？

Question

我正在使用 https://github.com/2fdevs/videogular开箱即用，效果非常好。

<videogular vg-width="videoWidth" vg-height="videoHeight" >
    <video class='videoPlayer' ng-model="currentVideo">
        <source ng-src='{{currentVideo.videoLocation}}' test="{{currentVideo}}" type='video/ogg'></source>
    </video>
</videogular>

我不确定我会如何让视频以编程方式播放，因为自动播放不是真的？我知道我可以在包含上述标记的 Controller 中调用 angular.element() 然后调用 .play() 但从我读到的内容来看这似乎是错误的。我不应该在任何 Controller 中调用 angular.element()。

我该怎么办？我应该创建一个执行此操作的指令吗？将“播放”和“暂停”视频的逻辑放在哪里最好(顺便说一句，我想在屏幕上显示两个视频，第一个结束后，做一些事情然后播放第二个)。

Answer 1

昨天我们公开了可通过 $scope 访问的 API，因此您可以访问所有可用的方法。

您可以查看 API here .

此版本尚未通过 Bower 提供，我们计划在本周末这样做。

更新

了解视频何时完成的最佳方法是在 Controller 中添加范围函数。

$scope.onCompletePlayer1 = function() {
    console.log("on complete 1");
};

$scope.onCompletePlayer2 = function() {
    console.log("on complete 2");
};

然后在 HTML 中添加 videogular 指令中的那些函数。

<videogular vg-complete="onCompletePlayer1()" ...></videogular>
<videogular vg-complete="onCompletePlayer2()" ...></videogular>

最后在 videogular.js 中添加 vg-complete 作为 $scope 函数:

\\Line 159
vgComplete: "&" 

\\Line 507
$scope.onComplete = function(event) {
    vg.setState(VG_STATES.STOP);
    $scope.$emit(VG_EVENTS.ON_COMPLETE);
    $scope.vgComplete();
    $scope.$apply();
};

我们将尝试在下一个版本中添加此功能，因此您可能需要等待几天。