angular

Angularアプリで効果音を出す

Webアプリで独自の効果音を出したい話。
HTML内にタグを追記することなく、Typescript側だけで対応可。

dialog.component.ts
export class DialogComponent implements OnInit {

//コンポーネントのメンバとしてHTMLAudioElementを作成
    private SoundWarning: HTMLAudioElement = new Audio('sound/warning1.mp3');

//コンポーネントの呼出段階で音源ファイルを読み込んでおく
    ngOnInit() {
        this.SoundWarning.load();
    }

//メソッドが実行された時に音を鳴らす
    openDialog(DialogMessage){
        ....
        this.SoundWarning.play();
        ....
    }
}

効果音ならす部分をサービス化するとか、もう少し凝ったこと出来るけど次回に回して、とりあえず忘備録。