angular - 单击时从角度组件实例化角度自定义指令

Question

假设我有一个名为“my-custom-directive”的指令和一个名为“app.component”的组件我在 app.component 中有一个方法 - createDirective() 将在单击 app-component.html 中的按钮时调用我想用这个方法实例化 my-custom-directive。如何在 angular2 及以上版本中做到这一点？

我尝试使用 Renderer2 但无法从组件创建指令

Answer 1

import { Directive, HostListener } from '@angular/core';

@Directive({
  selector: '[my-custom-directive]'
})
export class MyCustomDirective {

  constructor() { }

  @HostListener('click', ['$event']) onClick($event: Event) {
    // Do what ever you want to do ....
  }
}

// In Your Component HTML : 
<button my-custom-directive></button>

// Don't forget to include the references in your Module.
// See if this Solves your purpose.