单击时附加角度分量答案

【问题标题】：append angular component on click单击时附加角度分量
【发布时间】：2018-09-18 04:32:45
【问题描述】：

我想通过单击按钮在 div 中添加一个类 myBLock 的组件

code:
<div class="myExample">
    <button (click)="addComponent()">
    </button>
</div>
<div class="myBlock">
</div>

【问题讨论】：

【解决方案1】：

如果要添加html：

html

<div class="myBlock" #block>
</div>

在组件中：

@ViewChild('block') block:ElementRef;

addComponent() {
  block.nativeElement.insertAdjacentHTML('beforeend', '<div></div>');
}

如果你想添加一个组件，你需要动态地做：

【讨论】：

【解决方案2】：

您可以根据按钮单击将组件变量设置为 true / false。然后根据变量值，显示/隐藏组件。

<div>
  <button (click)='showMyBlock = !showMyBlock'>
  </button>
</div>

<another-component *ngIf='showMyBlock'>
</another-component>

【讨论】：