2017-01-20 29 views
1

我正在使用Angular Flickity指令开发照片幻灯片。我可以使用FlickityService调用下一个和上一个功能,将幻灯片移动到下一张和上一张幻灯片。但是我怎样才能控制玩家的开始和停止,尽管Flickity api有stopPlay和startPlayer?如何使用FlickityService控制播放器的启动/停止

HTML:

<button ng-click="previous()">Previous </button> 
<button ng-click="next()">Next </button> 
<button ng-click="play()">Play </button> 
<button ng-click="stop()">Stop </button> 
<div class="gallery-container"> 
     <div class="gallery-slides" 
      bc-flickity="{{ flickityOptions }}" 
      bc-flickity-id="demoId1"> 
      <div class="gallery-slide" ng-repeat="slide in photoList track by $index"> 
       <img ng-src="{{slide}}" /> 
      </div> 
    </div> 
</div> 

在我的角度控制器,我有以下功能:

$scope.FlickityService = FlickityService; 

$scope.next = function() { 
    $scope.FlickityService.next("demoId1", true); 
} 
$scope.previous = function() { 
    $scope.FlickityService.previous("demoId1", true); 
} 
$scope.stop = function() { 
    // ??? 
} 
$scope.start = function() { 
    // ??? 
} 

回答

0

我可以使用,而不是使用FlickityService调用Flickity API来启动和停止下面的代码玩家。

$scope.start = function() { 
    var flkty = Flickity.data($('.gallery-slides')[0]); 
    flkty.playPlayer(); 
} 
$scope.stop = function() { 
    var flkty = Flickity.data($('.gallery-slides')[0]); 
    flkty.stopPlayer(); 
}