准备
为了使用tooltip,可以安装ng-bootstrap组件,它包含两个依赖:
- angular:5.0以上版本;
- bootstrap css: 4.0版本。
安装好bootstrap之后,更新angular.json文件
"styles": [ "node_modules/bootstrap/dist/css/bootstrap.min.css" ]
需要注意的是只能引入css文件,不能引入其他的js依赖,例如:bootstrap.js, jQuery, popper.js。
安装ng-bootstrap
npm install --save @ng-bootstrap/ng-bootstrap
引入到angular主模块中
import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; @NgModule({ ... imports: [NgbModule, ...], ... }) export class YourAppModule { }
在html文件中使用tooltip
<button type="button" class="btn btn-outline-secondary mr-2" placement="top" ngbTooltip="Tooltip on top"> Tooltip on top </button>
原文地址:https://www.cnblogs.com/lucky-heng/p/11029308.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。