我有一些外部JQuery文件和Bootstrap模板一起提供。实际上,JQuery是供SideBar菜单打开/关闭菜单的。我为此创建了单独的组件。
问题: 当我将这个外部JQuery文件放入index.html或angular.json文件时,它不起作用,甚至单击事件都没有触发。
Index.html
<body id="page-top">
<app-root></app-root>
<script src="./assets/js/jquery.min.js"></script>
<script src="./assets/js/stylish-portfolio.js"></script>
</body>
Angular.json
"styles": [
"src/styles.css",
"src/assets/css/bootstrap.css",
"src/assets/css/stylish-portfolio.css",
"./node_modules/font-awesome/css/font-awesome.css"
],
"scripts": [
"src/assets/js/jquery.min.js",
"src/assets/js/bootstrap.bundle.min.js",
"src/assets/js/jquery.easing.min.js",
"src/assets/js/stylish-portfolio.js"
]
但是,当我将此JQuery添加到Component的打字稿文件中时,它开始工作。 打字稿文件:
declare var $: any;
ngOnInit() {
$(".menu-toggle").click(function (e) {
e.preventDefault();
$("#sidebar-wrapper").toggleClass("active");
$(".menu-toggle > .fa-bars, .menu-toggle > .fa-times").toggleClass("fa-bars fa-times");
$(this).toggleClass("active");
});
}
据我所知,无论我们保存到Angular.json或Index.html文件中的JQuery文件如何,它都应该起作用。这里怎么了..