Question

我正在使用Ionic-Framework，我正在使用Videogular插件播放视频。但是当我在iOS上模拟它时，它不会自动播放，而是在桌面上播放。

我的HTML：

<videogular vg-width="config.width" 
vg-height="config.height" 
vg-theme="config.theme.url" 
vg-autoplay="config.autoPlay" 
vg-stretch="config.stretch.value" 
vg-responsive="config.responsive">
<video class='videoPlayer' controls preload='none'>
    <source src='assets/videos/level1.mp4' type='video/mp4'>
    <source src='assets/videos/level1.ogv' type='video/ogg'>
</video>

<vg-overlay-play>Test</vg-overlay-play>
</videogular>

模块：

angular.module('starter', [
                        'ionic', 
                        'starter.controllers', 
                        'starter.services',
                        "com.2fdevs.videogular",
                        "com.2fdevs.videogular.plugins.controls",
                        "com.2fdevs.videogular.plugins.overlayplay",
                        "com.2fdevs.videogular.plugins.buffering",
                        "com.2fdevs.videogular.plugins.poster"
                        ])

.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
   // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
   // for form inputs)
});
})

Answer 1

你应该在视频标签中使用vg-autoplay =“true”：

<videogular vg-autoplay="true">

完整示例：

<div class="videogular-container">
    <videogular vg-player-ready="onPlayerReady()" vg-complete="onCompleteVideo()" vg-theme="config.theme.url" vg-autoplay="true">
        <vg-video vg-src="config.sources" vg-tracks="config.tracks" vg-preload="config.preload"></vg-video>

        <vg-controls vg-autohide="config.plugins.controls.autoHide" vg-autohide-time="config.plugins.controls.autoHideTime">
            <vg-play-pause-button></vg-play-pause-button>
            <vg-timedisplay>{{ currentTime | date:'mm:ss' }}</vg-timedisplay>
            <vg-scrubBar>
                <vg-scrubbarcurrenttime></vg-scrubbarcurrenttime>
            </vg-scrubBar>
            <vg-timedisplay>{{ timeLeft | date:'mm:ss' }}</vg-timedisplay>
            <vg-volume>
                <vg-mutebutton></vg-mutebutton>
                <vg-volumebar></vg-volumebar>
            </vg-volume>
            <vg-fullscreenButton></vg-fullscreenButton>
        </vg-controls>

        <vg-overlay-play></vg-overlay-play>
        <vg-buffering></vg-buffering>
        <vg-poster-image vg-url='config.plugins.poster'></vg-poster-image>
        <div class="my-logo-layer" ng-show="API.currentState != 'play'">
            <img src="http://www.videogular.com/img/videogular.png">
        </div>
    </videogular>
</div>

Answer 2

您无法在移动设备上自动播放，操作系统默认禁用它。

Answer 3

我设法让它工作，但我不知道它是如何工作的。我尝试的最后一件事是将autoplay =“autoplay”放入。

<videogular id="intro-video" vg-width="config.width" 
 vg-height="config.height" 
 vg-theme="config.theme.url" 
 vg-autoplay="config.autoPlay" 
 vg-stretch="config.stretch.value" 
 vg-responsive="true">
 <video class='videoPlayer' autoplay='autoplay' webkit-playsinline>
    <source src='assets/videos/level1.mp4' type='video/mp4'>
    <source src='assets/videos/level1.ogv' type='video/ogg'>
 </video>
</videogular>

适用于iOS的视频自动播放功能无法在应用中运行

3 个答案: