iPad HTML5 视频标签列表和滚动问题

Question

我正在构建基于 PhoneGap 的跨平台应用程序。
我正在 iPad 上测试这个应用程序，我正在使用 AngularJS。

我使用ng-repeat 创建了一个媒体文件列表，如下所示：

<div ng-repeat="media in mediaArray" style="width:200px; height:200px;">

     <img ng-src="{{media.imgSrc}}" 
          ng-hide="media.isVideo" 
          style="width:200px; height:200px;"
          >

     <video id="video{{media.id}"
            ng-show="media.isVideo"
            postersrc="test.png" 
            poster-src  <!-- Directive for poster source fix -->   
            controls 
            style="width:200px; height:200px;"
            >
            <source type="video/mp4" 
                    videosrc="{{media.videoUrl}}"
                    video-src  <!-- Directive for video source fix -->   
                    >
            Your browser does not support HTML5 video.                    
     </video>
</div>

在我的列表中，我有图片和视频文件。
我可以看到列表，也可以播放视频文件。

但问题是，当我播放任何视频时，我无法滚动列表，滚动一直有效，直到播放视频后我不播放任何视频滚动根本不起作用。可能是什么问题？

Answer 1

试试这个

<div ng-repeat="media in mediaArray" ng-controller="ScrollController" style="width:200px; height:200px;">

     <img ng-src="{{media.imgSrc}}" 
          ng-hide="media.isVideo" 
          style="width:200px; height:200px;"
          >

     <video id="video{{media.id}"
            ng-show="media.isVideo"
            postersrc="test.png" 
            poster-src  <!-- Directive for poster source fix -->   
            controls 
            style="width:200px; height:200px;"
            >
            <source type="video/mp4" 
                    videosrc="{{media.videoUrl}}"
                    video-src  <!-- Directive for video source fix -->   
                    >
            Your browser does not support HTML5 video.                    
     </video>
</div>

控制器脚本

angular.module('anchorScrollExample', [])
.controller('ScrollController', ['$scope', '$location', '$anchorScroll',
  function ($scope, $location, $anchorScroll) {
    $scope.gotoBottom = function() {
      // set the location.hash to the id of
      // the element you wish to scroll to.
      $location.hash('bottom');

      // call $anchorScroll()
      $anchorScroll();
    };
  }]);