Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/opengl/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angularjs 录像带-提示点不工作_Angularjs_Html5 Video_Videogular - Fatal编程技术网

Angularjs 录像带-提示点不工作

Angularjs 录像带-提示点不工作,angularjs,html5-video,videogular,Angularjs,Html5 Video,Videogular,最近我开始学习的线索点 我的目标是在给定的时间(这里是第5秒)暂停视频 这是我的角度控制器: angular.module('myApp',[ "ngSanitize", "com.2fdevs.videogular", "com.2fdevs.videogular.plugins.controls" ]) .controller('HomeCtrl', [ '$sce', function ($sce) { this.API = null

最近我开始学习的线索点

我的目标是在给定的时间(这里是第5秒)暂停视频

这是我的角度控制器:

angular.module('myApp',[
    "ngSanitize",
    "com.2fdevs.videogular",
    "com.2fdevs.videogular.plugins.controls"
])
.controller('HomeCtrl', [
    '$sce',
    function ($sce) {
        this.API = null;
        this.onPlayerReady = function(API){
            this.API = API;
        };
        this.init = function init(){
            var timePoint = [];
            var start = 5;
            var end = 6;

            var result = {};
            result.timeLapse = {
                start: start,
                end: end
            };

            result.onLeave = function onLeave(currentTime, timeLapse, params) {
                console.log('onleave');
            };

            result.onUpdate = function onComplete(currentTime, timeLapse, params) {
                console.log('completed');

            };

            result.onComplete = function onUpdate(currentTime, timeLapse, params) {
                console.log('update');
            };

            timePoint.push(result);

            this.config = {
                preload: "none",
                sources: [
                    {src: $sce.trustAsResourceUrl(hv.url), type: "video/mp4"}
                ],
                theme: {
                    url: "http://www.videogular.com/styles/themes/default/latest/videogular.css"
                },
                cuePoints: {
                    timePoint: timePoint
                },
                plugins: {
                    controls: {
                        autoHide: true,
                        autoHideTime: 5000
                    }
                }
            };
        };
        this.init();
    }]
);
此控制器大部分工作正常,但
onLeave
onUpdate
onComplete
回调都不起作用,6秒后控制台中不会打印日志

我的密码有问题吗?谢谢


我的Angular版本是1.3.17,Videogular版本是1.2.4。

这里有一个工作示例:

JS:

HTML:



您可能会在HTML中出现错误。

您可以发布您的HTML代码吗?
'use strict';
angular.module('myApp', [
    "ngSanitize",
    "com.2fdevs.videogular"
  ])
  .controller('HomeCtrl', [
    '$sce',
    function($sce) {
      this.API = null;
      this.onPlayerReady = function(API) {
        this.API = API;
      };

      this.init = function init() {
        var timePoint = [];
        var start = 0;
        var end = 6;

        var result = {};
        result.timeLapse = {
          start: start,
          end: end
        };

        result.onLeave = function onLeave(currentTime, timeLapse, params) {
          console.log('onleave');
        };

        result.onUpdate = function onUpdate(currentTime, timeLapse, params) {
          console.log('onUpdate');

        };

        result.onComplete = function onComplete(currentTime, timeLapse, params) {
          console.log('onComplete');
        };

        timePoint.push(result);

        this.config = {
          preload: "none",
          sources: [{
            src: $sce.trustAsResourceUrl("http://static.videogular.com/assets/videos/videogular.mp4"),
            type: "video/mp4"
          }],
          theme: {
            url: "http://www.videogular.com/styles/themes/default/latest/videogular.css"
          },
          cuePoints: {
            timePoint: timePoint
          },
          plugins: {
            controls: {
              autoHide: true,
              autoHideTime: 5000
            }
          }
        };
      };
      this.init();
    }
  ]);
<div ng-app="myApp">
<div ng-controller="HomeCtrl as controller" class="videogular-container">
  <videogular vg-cue-points="controller.config.cuePoints" vg-theme="controller.config.theme.url">
    <vg-media vg-src="controller.config.sources"
          vg-tracks="controller.config.tracks"
          vg-native-controls="true">
    </vg-media>
  </videogular>
</div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-sanitize.min.js"></script>
<script src="http://static.videogular.com/scripts/videogular/latest/videogular.js"></script>