jquery 如何在angular项目中包含popper.js和bootstrap.js

oyxsuwqo  于 2023-10-17  发布在  jQuery
关注(0)|答案(5)|浏览(151)

我使用的Angular 与openlayers和我下面的例子张贴在链接:

https://openlayers.org/en/latest/examples/overlay.html

上述链接提供以下信息,以便与弹出框一起使用:

Things to know when using the popover plugin:
Popovers rely on the 3rd party library Popper.js for positioning. You must include popper.min.js before bootstrap.js or use bootstrap.bundle.min.js / bootstrap.bundle.js which contains Popper.js in order for popovers to work!

请让我知道如何包括

popper.js

bootstrap.js

这样我就可以使用popover函数并让它工作。

图片

46scxncf

46scxncf1#

您可以在src/styles.css之前在angular.json文件的build部分下添加node_modules/dist/css/boostrap.min.css。您可以从npm包npm install bootstrap下载 Bootstrap
为了使用弹出窗口,您可以在同一文件的构建部分下的脚本中添加 Bootstrap node_modules/bootstrap/dist/js/bootstrap.bundle.min.js的捆绑文件。
编辑:你必须下载JQuery并将其添加到你的脚本部分。

wwodge7n

wwodge7n2#

有一些步骤,你必须遵循

-1. Install Jquery like npm instll jquery -save
-2. Install latest bootStrap npm install [email protected] --save
-3. Install Popper js like npm install popper.js --save

然后将样式和脚本添加到angular.json文件中,如

========================================================================

a7qyws3x

a7qyws3x3#

用于外部JavaScript或任何要在angular上实现的文件。你必须在angular.json文件中设置文件的路径

angular.json

对于angular旧版本,需要在**.angular.json.json**上设置路径

注意:-修改angular.json文件后,需要重新编译或重启项目。

你可以将文件导入到index.html文件中。

30byixjq

30byixjq4#

这样在index.html文件中导入bootstrap更容易。

您可以在这里找到链接https://getbootstrap.com/

ao218c7q

ao218c7q5#

使用npm安装:
[propper]:> https://www.npmjs.com/package/propper
npm i propper --保存
[bootstrap]:> https://www.npmjs.com/package/bootstrap
npm i bootstrap --保存

相关问题