如何将my muse js整合到我的离子3项目中

时间:2017-08-31 03:23:10

标签: javascript angular typescript ionic2 ionic3

(我试图将以下代码集成到我的ionic3项目中,音乐将会播放,但皮肤图像将无法显示。任何帮助)

注意:我想使用ionic 3在我的muse javascript API应用中添加一个实时流媒体fm电台。

   <pre>
    <script type="text/javascript" src="https://hosted.muses.org/mrp.js">
            </script>
            <script type="text/javascript">
           MRP.insert({
           'url':'http://104.247.79.188:8000/kapitalfm929',
           'lang':'en',
           'codec':'mp3',
           'volume':100,
           'autoplay':true,
          'jsevents':true,
          'buffering':0,
          'title':'KFM',
          'welcome':'Station',
          'wmode':'transparent',
          'skin':'repvku-100',
          'width':100,
          'height':25
           });
          </script>

<pre>

1 个答案:

答案 0 :(得分:0)

您可以使用playpause按钮创建广播播放器的基本演示,如下所示。

无线电player.ts

export class RadioPlayer {
  url:string;
  stream:any;
  promise:any;

 constructor() {
   this.url = "http://akalmultimedia.net:8000/GDNSLDH";
   this.stream = new Audio(this.url);
 };

 play() {
   this.stream.play();
   this.promise = new Promise((resolve,reject) => {
     this.stream.addEventListener('playing', () => {
       resolve(true);
     });

     this.stream.addEventListener('error', () => {
       reject(false);
     });
   });

  return this.promise;
};

pause() {
  this.stream.pause();
};

}

html的

<ion-navbar *navbar> 
  <ion-title> Radio Player </ion-title> 
</ion-navbar> 

<ion-content class="home"> 
  <button dark (click)="play()"> 
    <ion-icon name="play"></ion-icon>
  </button> 
  <button dark (click)="pause()"> 
    <ion-icon name="pause"></ion-icon>
  </button> 
</ion-content>

您可以详细了解this here。但那是Ionic 2 app.So在您Ionic 3 app上正确使用它。