简体   繁体   English

当我将 Jquery 和 popper.js 集成到 angular 时,它不起作用

[英]Jquery and popper.js not working when I integrated it into angular

I want to integrate jquery and popper.js in my angular project I installed both and add to packages.json as well as in angular.json but it doesn't work我想在我的 angular 项目中集成 jquery 和 popper.js 我安装了这两个并添加到 packages.json 以及 angular.json 但它不起作用

packages.json :包.json :

"dependencies": {
    "@angular/animations": "~10.0.6",
    "@angular/common": "~10.0.6",
    "@angular/compiler": "~10.0.6",
    "@angular/core": "~10.0.6",
    "@angular/forms": "~10.0.6",
    "@angular/platform-browser": "~10.0.6",
    "@angular/platform-browser-dynamic": "~10.0.6",
    "@angular/router": "~10.0.6",
    "popper.js": "^1.16.1",
    "bootstrap": "^4.5.3",
    "jquery": "^3.5.1",
    "rxjs": "~6.5.5",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.3"
  }

angular.json:角度.json:

 "styles": [
              "src/styles.css",
              "node_modules/bootstrap/dist/css/bootstrap.min.css"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "node_modules/popper.js/dist/umd/popper.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
            ]

First did you do it manually or by npm ?首先你是手动还是通过 npm 做的? Second did you restart the server after installing ?其次,您安装后是否重新启动了服务器?

Finally I don't see where the problem is so I add the scripts in index.html now it works最后我没有看到问题出在哪里,所以我在 index.html 中添加了脚本,现在它可以工作了

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何使用 Angular 6 安装 bootstrap 4 + jquery + popper.js - How to install bootstrap 4 + jquery + popper.js with Angular 6 在 Gridsome 中使用 jQuery 和 Popper.js - Use jQuery and Popper.js in Gridsome Bootstrap 与 jQuery 和 Popper.js (svelte) - Bootstrap with jQuery and Popper.js (svelte) 使用 NPM 将 Bootstrap 添加到项目时,如何让 bootstrap.js、jquery 和 popper.js 工作? - How to get bootstrap.js,jquery and popper.js to work when using NPM to add Bootstrap to a project? Rails 6.0.3.2 yarn add bootstrap jquery popper.js 不工作,不能使用引导工具提示 - Rails 6.0.3.2 yarn add bootstrap jquery popper.js is not working and cannot use bootstrap tooltip 如何在 angular 项目中包含 popper.js 和 bootstrap.js - How to include popper.js and bootstrap.js in angular project 当网站转换为wordpress时,下拉列表(Bootstrap 4 popper.js)链接不起作用,但在网站的HTML版本中工作正常 - Dropdown (Bootstrap 4 popper.js) links not working in when the site is converted to wordpress but works fine in the HTML version of the website 如何使用popper.js - How to use popper.js 使用 popper.js 添加 eventRender 时,fullcalendar 解析 json 失败 - fullcalendar failure parsing json when adding eventRender with popper.js 配置popper.js方向 - Configure popper.js orientation
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM