Question

我尝试使用角度来播放视频文件。当我在console.log(url)中查看$scope.playVideo时。它传递了正确的网址(http://localhost:20205/Content/RaceVideos/IE/ABB/NOTTS-2016-03-21-HT14.mp4)，但在我插入video.play(url);后显示以下错误。我不知道哪里出错了。我不知道这段代码是否正确？

    angular.js:13920 Error: One of template or templateUrl options is required.
 at Object.l.open (ui-bootstrap-0.14.3.min.js:9)
    at Object.play (Global.js:768)
    at ChildScope.$scope.playVideo (VideosController.js:29)
    at fn (eval at compile (angular.js:14817), <anonymous>:4:451)
    at expensiveCheckFn (angular.js:15906)
    at callback (angular.js:25885)
    at ChildScope.$eval (angular.js:17682)
    at ChildScope.$apply (angular.js:17782)
    at HTMLAnchorElement.<anonymous> (angular.js:25890)
    at HTMLAnchorElement.dispatch (jquery-2.2.1.js:4732)

角度控制器

  $scope.playVideo = function (url) { 
video.play(url); }

HTML

 <td><a ng-click="playVideo('http://localhost:20205/Content/'+film)" target="_blank" class="cursor-pointer"><span class="glyphicon glyphicon-film"></span></a></td>

Answer 1

试试这个。动态创建video元素并将video.src设置为url。然后拨打video.play();

＆＃13;

var app = angular.module('myApp', []);
app.controller('AppController', [
  '$scope',
  function($scope) {
    $scope.videoIcon = true;
    $scope.playVideo = function(url) {
      var video = document.createElement("video");
      $scope.videoIcon = false;
      angular.element(document.getElementsByTagName('body')).append(video);
      video.src = url;
      video.play();
    }
  }
]);

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<html ng-app="myApp">

<body ng-controller="AppController">
  <a ng-click="playVideo('https://www.w3schools.com/html/mov_bbb.mp4')" target="_blank" class="cursor-pointer"><span class="glyphicon glyphicon-film" ng-if="videoIcon">
</span>
  
  </a>
</body>

</html>

＆＃13;

尝试使用angularjs加载视频时出错

1 个答案: