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