Angular 6 附加 svg onclick 事件

Question

我正在尝试在我的 Angular 应用程序中以 noraml html 加载一个 svg 对象我正在使用此代码：

 <object data="assets/img/bihar.svg" id="biharsvg" type="image/svg+xml"></object>

它加载正常，但我想使用点击事件加载这个对象，因为我已经看到了 innerHTML，但这不起作用，这是在任何 div 中应用它的最佳方法。

我正在使用此代码：

 <div [innerHTML]="htmlContent"></div>

在我的 html 和 component.ts 中，我正在使用以下代码：

 this.htmlContent = `<h2>Hello</h2>`

当我这样做时，这工作正常：

   this.htmlContent = `<object data="assets/img/bihar.svg" id="biharsvg" type="image/svg+xml"></object>`

我收到警告消息：

WARNING: sanitizing HTML stripped some content

我的 svg 对象没有加载将我的对象附加到 html 中的最佳方式。

Answer 1

<div *ngIf="loadsvg">
     <object data="assets/img/bihar.svg" id="biharsvg" type="image/svg+xml"></object>
</div>

在 .ts 文件中

public loadsvg = false;

onlcikLoadSvg(){
this.loadsvg =true;
}