点击时附加角度分量

Question

我想在点击按钮

的同时在div中添加一个组件myBLock

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

Answer 1

如果你想添加html：

HTML

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

组件中的

：

@ViewChild('block') block:ElementRef;

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

如果要添加组件，则需要动态执行：

https://angular.io/guide/dynamic-component-loader

Answer 2

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

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

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