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();
};

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