Аудио плеер для ионных

Question

Я изучаю ионный и хочу встроить аудиоплеер. Я нашел этот пример Plnkr из Video Player:

angular.module('app',[]) 

.directive('youtubeIframe', ['$timeout', function ($timeout, $sce) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
      $timeout(function() { 
       var temp1 = '<iframe width="400px" height="200px" src="http://www.youtube.com/embed/'; 
       var temp2 = '?&autoplay=0&autohide=1&fs=1&cc_load_policy=1&loop=0&rel=0&modestbranding=1&&hd=1&playsinline=0&showinfo=0&theme=light" frameborder="1" allowfullscreen></iframe>'; 
       var finalvar = temp1 + attrs.youtubeIframe + temp2 ; 
       console.log('Finalvar is: ' + finalvar); //just to check if url is ok 
       element.prepend(finalvar); 
      }, 150); 
      // The timeout is to give enough time for the Dom to be built and checked for its structure, so that we can manipulate it. 
     } 
    }; 
}]) 



.controller('VideoCtrl', function($scope) { 

    $scope.angularvideos = [ 
     { 
     name: 'Angular on the go: Using Angular to power Mobile Apps', 
     youtubeId: 'xOAG7Ab_Oz0', 
     publishdate: 'Dec 2013' 
     }, 
     { 
     name: 'Crafting the Perfect AngularJS Model and Making it Real Time', 
     youtubeId: 'lHbWRFpbma4', 
     publishdate: 'April 2014' 
     }, 
     { 
     name: 'AngularJS & D3: Directives for Visualizations', 
     youtubeId: 'aqHBLS_6gF8', 
     publishdate: 'Jan 2014' 
     }, 
     { 
     name: 'The Thick Front End', 
     youtubeId: 'hv2NEW0uC1o', 
     publishdate: 'Nov 2013' 
     } 
    ]; 
}) 

Может кто-то пожалуйста указать мне на аналогичный пример для аудиоплеер в IFRAME для мобильного приложения (Android на некоторое время, но потом прошивка, а).

Благодаря & С уважением

Answer 1

Я думаю, правильно имеющийся там- ссылки:

Dev-friendly and stable module for audio, html5-video, youtube(iframe) etc..

Вот Example создания Audio Player.

Вот codepen

<videogular vg-theme="controller.config.theme.url" class="videogular-container audio"> 
    <vg-media vg-src="controller.config.sources"></vg-media> 

    <vg-controls> 
     <vg-play-pause-button></vg-play-pause-button> 
     <vg-time-display>{{ currentTime | date:'mm:ss' }}</vg-time-display> 
     <vg-scrub-bar> 
      <vg-scrub-bar-current-time></vg-scrub-bar-current-time> 
     </vg-scrub-bar> 
     <vg-time-display>{{ timeLeft | date:'mm:ss' }}</vg-time-display> 
     <vg-volume> 
      <vg-mute-button></vg-mute-button> 
     </vg-volume> 
    </vg-controls> 
</videogular> 

Answer 2

Я выпустила модуль Ionic, который играет аудио изначально (тестировал на Android до сих пор), используя плагин Кордова Медиа.

Вы определяете вид Ionic:

<ion-view view-title="Music"> 
    <ion-content> 
     <ion-audio-track track="myTrack"> 
      <div class="list list-inset"> 
       <div class="item item-thumbnail-left"> 
        <img src="{{track.art}}"> 
        <h2>{{track.title}}</h2> 
        <p>{{track.artist}}</p> 
        <ion-audio-play></ion-audio-play> 
       </div> 
       <div class="item"> 
       <ion-audio-progress-bar display-time></ion-audio-progress-bar> 
       </div> 
      </div> 
     </ion-audio-track> 
    </ion-content> 
</ion-view> 

И ваша сфера:

$scope.myTrack = { 
    url: 'https://www.example.com/my_song.mp3', 
    artist: 'Somebody', 
    title: 'Song name', 
    art: 'img/album_art.jpg' 
} 

выглядит так:

Вы можете найти здесь: https://github.com/arielfaur/ionic-audio