Angular 7在外部JQuery中的问题

时间:2019-01-18 12:02:50

标签: jquery angular

我有一些外部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文件如何,它都应该起作用。这里怎么了..

0 个答案:

没有答案