javascript - 在 NgbTooltip 内容中包含超链接(带有 _blank 目标)属性
问题描述
我对 NgbTooltip 有一个要求,
- 工具提示应允许包含带有“_blank”目标的超链接。例如:了解更多
- 单击文档正文时,工具提示应隐藏。
以下是我的方法,并没有按预期工作。
<a [ngbTooltip]="hintTooltip" tabindex="0" triggers="click:blur">hint</a>
<ng-template #hintTooltip>
Sample hint description
<a href="www.abc.com" target="_blank">Learn more</a>
</ng-template>
上面的代码通过显示超链接打开工具提示。但是当我单击超链接时,它没有打开一个新窗口,而是隐藏了工具提示。
堆栈闪电战: https ://stackblitz.com/edit/angular-viipeo-dqjmfh ?file=app/tooltip-triggers.html
感谢是否有人可以提供帮助
解决方案
已修复,如果有人感兴趣,以下是解决方案
.html
<a [ngbTooltip]="hintTooltip" tabindex="0" triggers="click:blur">hint</a>
<ng-template #hintTooltip>
Sample hint description
<a href="www.abc.com" target="_blank" (click)="nToolTip(t1, 'http://www.google.com');">Learn more</a>
</ng-template>
.ts
_toolTipCollection = [];
nToolTip(tooltip, _url?: string): void {
if (tooltip.isOpen()) {
if (_url) {
window.open(_url, '_blank');
}
}
for (const tooltip of this._toolTipCollection) {
tooltip.close();
}
this._toolTipCollection = [];
tooltip.toggle();
this._toolTipCollection.push(tooltip);
}
推荐阅读
- sumo - 使用 TRACI 控制 SUMO 中的多个红绿灯路口
- gcc - obj-copy 忽略一些填充
- angular - 无法在代码共享项目中使用 Nativescript Localstorage 插件
- java - Java如何遍历3个arrayList
- laravel - 如何在 laravel 的刀片中添加布局?
- vba - 连接单元格但之前检查值 - Excel VBA
- objective-c - Xcode 10 GM 种子:NS_OPTIONS(选项的 objc 导出)不再编译
- gradle - 您如何在 gradle 中并行运行 ScalaTest 测试套件?
- java - 如何使用迭代器访问类的这些元素?
- google-cloud-dataflow - 在语句中使用聚合时 Beam SQL 不起作用:“无法计划执行”