动态挂载角2指令

Question

上下文

我有一个简单的指令，根据接收到的属性向给定的HTML元素添加一些属性。

<button class="btn btn-blue x-large" [myDirective]="{ some_json_data: true }">
    Unfold
</button>

myDirective指令只是在ngOnInit钩子中执行一些逻辑，并修饰ElementRef本机元素(在本例中是按钮)，添加属性，没有什么复杂。

ngOnInit(): void {
  const el: Element = this.element.nativeElement;
  this.decorate(el, this.myDirective);
}

问题

基于给定的逻辑(在myDirective修饰中)，我想向ElementRef在myDirective上引用的元素添加一个工具提示(这是另一个指令)。

如何手动挂载指令，以及如何将其添加到元素(ViewContainerRef)?

Answer 1

不支持动态添加或删除指令。只有组件可以动态添加和删除(只有动态添加的组件才能动态删除)。

Answer 2

不动态添加或删除指令，但如果要添加工具提示，则必须在组件模板中插入一个div，该div将根据变量状态激活该命令。

​

<div [hidden]="tooltipnotshown"
     class="tooltip">
 blah blah or whatever ...
</div>

​