AngularでYouTube埋め込みをしようとしたらハマった

解決法

innerHTMLに設定するHTMLはデフォルトでサニタイズされるようになっており、iframeタグが自動的に除去されるのが原因でした。
サニタイズされるのはjavascriptだけだと思っていましたが、iframeも駄目みたいです。

import { DomSanitizer } from '@angular/platform-browser';
constructor(private sanitizer: DomSanitizer) {}

let innerHTML = this.sanitizer.bypassSecurityTrustHtml(html);

注意

サニタイズすると、iframeだけではなくjavascriptも埋め込み可能になるのでXSSには注意して下さい。

参考

• Security - GUIDE
• DomSanitizer - API