Angular 7为动态生成的html添加指令

问题描述 投票:1回答:1

我使用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]或任何指令?

angular dynamic angular-directive
1个回答
0
投票
 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`;
    }

这会将Material Tooltip附加到动态添加的元素。

© www.soinside.com 2019 - 2024. All rights reserved.