允许在<a> tag title attribute

时间:2017-08-10 09:13:04

标签: javascript angular pipe tooltip

I have tried to find a solution to this problem and so far I have come up with this pipe that should allow HTML

import { PipeTransform, Pipe } from "@angular/core";

@Pipe({
    name: "toHtml"
})
export class ToHtmlPipe implements PipeTransform {
    transform(content) {
        return `<b>${content}</b>`;
    }
}

I have a link, which displays a data tool tip on hover:

<a *ngIf="day.Info.Info" data-toggle="tooltip" [title]="day.Info.Info | toHtml" placement="right"><i style="color:black" class="glyphicon glyphicon-comment"></i></a>

However, this is the result I get:

enter image description here

中添加html

因此管道不起作用而且我不能使用[innerHtml]="",因为它只是更改了字符串的链接,而不是图标。

提前感谢您的帮助

1 个答案:

答案 0 :(得分:3)

根据评论,查看工具提示的Bootstrap文档;

https://v4-alpha.getbootstrap.com/components/tooltips/#interactive-demo

  

添加了自定义HTML:

     

<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-html="true" title="<em>Tooltip</em> <u>with</u> <b>HTML</b>"> Tooltip with HTML </button>

您需要将data-html="true"属性放在<a>元素上。