Question

我正在尝试从javascript触发ngx-bootstrap Tooltip。下面的代码没有任何问题。现在我想手动从javascript端调用show（）函数。

问题是我不知道＆＃34; bs-tooltip＆＃34;是。它是由ngx-bootstrap创建的元素的id。如果是这样，我如何从javascript中获取此元素？

<p>
  <span tooltip="Hello there! I was triggered manually"
        triggers="" #customTooltip="bs-tooltip">
  This text has attached tooltip
  </span>
</p>

<button type="button" class="btn btn-success" (click)="customTooltip.show()">
  Show
</button>
<button type="button" class="btn btn-warning" (click)="customTooltip.hide()">
  Hide
</button>
<button type="button" class="btn btn-info" (click)="customTooltip.toggle()">
  Toggle
</button>

编辑：

document.getElementById("bs-tooltip")  //returns null

Answer 1

尝试使用viewChild访问组件类中的customTooltip：

import { ViewChild } from '@angular/core';

export class YourComponent {
    @ViewChild('customTooltip') tooltip: ElementRef;
    onClick() {
        this.tooltip.show();
    }
}

<span #customTooltip="bs-tooltip" tooltip="Hello there! I was triggered manually" triggers="" > This text has attached tooltip</span>

如何从javascript触发工具提示？

1 个答案: