作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我试图找到这个问题的解决方案,到目前为止我已经想出了这个允许 HTML 的管道
import { PipeTransform, Pipe } from "@angular/core";
@Pipe({
name: "toHtml"
})
export class ToHtmlPipe implements PipeTransform {
transform(content) {
return `<b>${content}</b>`;
}
}
我有一个链接,它在悬停时显示数据工具提示:
<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>
但是,这是我得到的结果:
所以管道不起作用,据我所知,我无法使用 [innerHtml]=""
因为它只是更改了字符串的链接,而不是图标。
预先感谢您的帮助
最佳答案
根据评论,查看 Bootstrap 文档中的工具提示;
https://v4-alpha.getbootstrap.com/components/tooltips/#interactive-demo
And with custom HTML added:
<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>
上元素。
关于javascript - 允许 <a> 标签标题属性中包含 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45609318/
我是一名优秀的程序员,十分优秀!