Angular 7 добавляет директивы в динамически генерируемый HTML

Question

Я использую ngx-codemirror и хочу отобразить mat-tooltip , когда мышь вводит строку. Как это было сделано в AngularJS:

el = angular.element('.cm-string');
el.attr('uib-tooltip', "Tooltip text");
el.attr('tooltip-append-to-body', 'true');
$compile(el)(scope);

Есть ли способ динамически присоединить [matTooltip] или любую директиву?

Answer 1

 import....

 export class AppComponent  { 
   constructor(private injector: Injector) {
     const ourDynamicDiv = document.getElementById('anynewdiv');
     const tooltip: MatTooltip = Injector.create({
        parent: this.injector,
        providers: [
          {
            provide: ElementRef,
            useValue: new ElementRef(ourDynamicDiv)
          },
          {
            provide: MatTooltip,
            useClass: MatTooltip,
            deps: [
              Overlay,
              ElementRef,
              ScrollDispatcher,
              ViewContainerRef,
              NgZone,
              Platform,
              AriaDescriber,
              FocusMonitor,
              MAT_TOOLTIP_SCROLL_STRATEGY,
              Directionality,
              MAT_TOOLTIP_DEFAULT_OPTIONS,
              // HAMMER_LOADER
            ]
          }
        ]
      }).get(MatTooltip);
      tooltip.position = 'above';
      tooltip.message = `message text`;
    }

Прикрепляет всплывающую подсказку к динамически добавляемому элементу.