如何在点击时显示图像并播放视频

Question

我正在使用您的Tube api，如下所示：

<div class="some-classes-here">
                <iframe class="embed-responsive-item" *ngIf="item.url!== ''" [src]="item.url| safe" frameborder="0" style="z-index:999;"
                    webkitallowfullscreen mozallowfullscreen allowfullscreen >

                </iframe>

            </div>

这工作正常，我可以在屏幕上播放视频。但是，现在我有一个用例，可以用图像代替视频缩略图（图像包含一些视频帮助文本）。单击图像后，视频应在同一位置开始渲染。

有没有办法实现这一目标。我已经尝试了很多建议：

How to put image behind embedded youtube iframe

Hide YouTube video embed image before playing

YouTube embedded video: set different thumbnail

我应该在单击按钮时动态插入html吗？ 没有已知的YOU TUBE API解决方案。 请提出建议？

P.S：如果有帮助，我将在Angular 4上进行开发。