benhalverson
commented
5 years ago @Elecash I figured out my issue. One problem I still have is I need to press the button twice for the audio to play. Here's my updated code
audioplayer.ts
import { Component, OnInit } from '@angular/core';
import { VgAPI } from 'videogular2/core';
export interface IMedia {
title: string;
src: string;
type: string;
}
@Component({
selector: 'app-audio-player',
templateUrl: './audio-player.component.html',
styleUrls: ['./audio-player.component.css']
})
export class AudioPlayerComponent implements OnInit {
playlist: Array <IMedia> = [
{
title: 'Bell',
src: './assets/audio/bell-3.wav',
type: 'audio/wav'
},
{
title: 'compact car',
src: './assets/audio/compact-car-screeching.wav',
type: 'audio/wav'
},
{
title: 'crowd awww',
src: './assets/audio/crowd-aww.wav',
type: 'audio/wav'
}
];
currentIndex = 0;
currentItem: IMedia = this.playlist[ this.currentIndex ];
api: VgAPI;
public name: string;
controls: boolean = false;
autoplay: boolean = true;
loop: boolean = false;
preload: string = 'auto';
constructor() { }
onClickPLaylistItem(item: IMedia, index: number) {
this.currentIndex = index;
this.currentItem = item;
}
onPlayerReady(api: VgAPI) {
this.api = api;
this.api.getDefaultMedia().subscriptions.ended.subscribe(
() => {
// Set the video to the beginning
this.api.getDefaultMedia().currentTime = 0;
}
);
}
ngOnInit() {}
}
audioplayer.html
<div class="buttons">
<button mat-raised-button (click)="onClickPLaylistItem(item, $index); api.play()" *ngFor="let item of playlist; let $index = index" >
{{ item.title }}
</button>
<vg-player (onPlayerReady)="onPlayerReady($event)">
<vg-controls>
<vg-play-pause></vg-play-pause>
</vg-controls>
<audio #media [vgMedia]="media" [src]="currentItem.src" id="modalPlayer" preload="none"></audio>
</vg-player>
Description
I'm attempting to make a sound board app with Angular 6 and Electron. I'm trying to use Videogular 2 for the audio player. My github repo can be found here https://github.com/benhalverson/electron-angular-soundapp
Expected Behavior
No errors. The buttons should start or stop the audio player.
Actual Behavior
This is the error I'm getting.
Steps to Reproduce
My HTML
home.component.ts
app.module.ts