角4中的引导4.1
角4中的引导4.1
提问于 2018-04-13 13:40:53
如何从角度cli正确地安装引导4，以便所有引导组件都能工作？
我使用了以下命令：
- npm安装--保存jquery
- npm安装--保存popper.js
- npm安装--保存引导程序
并在angular-cli.json文件中配置以下内容：
"scripts": [
"../node_modules/jquery/dist/jquery.slim.min.js",
"../node_modules/popper.js/dist/umd/popper.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"
]弹出和工具提示不起作用..。但是引导css是有效的！
谢谢!
回答 1
Stack Overflow用户
发布于 2018-04-13 19:34:42
出于性能原因，工具提示是可选的，因此您需要为元素调用它：
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})然而，这只会在调用时对当前的元素设置工具提示。所以，如果你只是在你的应用程序加载时调用它，那么你的所有组件中的元素还不存在。我认为您需要在NgAfterViewInit中调用它，并且元素可能需要一个ViewChild。
一个更好的方法是创建一个指令，在该指令放置的任何组件上调用它(https://stackblitz.com/edit/angular-bhzy2y?file=app%2Fapp.component.html).
import { Directive, ElementRef } from '@angular/core';
declare var $: any;
// https://angular.io/guide/attribute-directives
@Directive({
selector: '[appTooltip]'
})
export class TooltipDirective {
constructor(er: ElementRef) {
$(er.nativeElement).tooltip();
}
}HTML：
<button data-placement="top" title="Tooltip on top" appTooltip>
This button has a tooltip
</button>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/49825491
复制相关文章
相似问题
腾讯云开发者
