Audio library based on howler.js for Angular
npm install ngx-howlershell
npm install ngx-howler --save
`
$3
Load howler.js library, you can use local or external CDN
`typescript
export class AppModule {
constructor(
ngxHowlerService: NgxHowlerService
) {
ngxHowlerService.loadScript('https://cdnjs.cloudflare.com/ajax/libs/howler/2.2.0/howler.min.js');
}
}
`
$3
Register an audio object
`typescript
export class ExampleComponent implements OnInit {
constructor(
public howl: NgxHowlerService
) {
}
ngOnInit() {
this.howl.register('dev', {
src: ['sound.mp3'],
html5: true
}).subscribe(status => {
// ok
});
}
}
`
Play this audio object
`typescript
export class ExampleComponent implements OnInit {
constructor(
public howl: NgxHowlerService
) {
}
play() {
this.howl.get('dev').play();
}
}
`
If howler's listen event is used, you need to manually cancel the listen when the page is destroyed
`typescript
export class ExampleComponent implements OnInit {
constructor(
public howl: NgxHowlerService
) {
}
ngOnInit() {
this.howl.get('dev').on('load', () => {
// ...
});
}
ngOnDestroy() {
this.howl.get('dev').off();
}
}
`
Unregistered audio object
`typescript
export class ExampleComponent implements OnInit {
constructor(
public howl: NgxHowlerService
) {
}
unregister() {
this.howl.unregister('dev');
}
}
``