在Angular中使用Bootstrap

You have to install both bootstrap and JQuery:

npm install bootstrap jquery --save

Then you will find these files in your node module folder:

node_modules/jquery/dist/jquery.min.js
node_modules/bootstrap/dist/css/bootstrap.min.css
node_modules/bootstrap/dist/js/bootstrap.min.js

Then you have to update your angular.json file:

In the architect, build section, or even test section if you want to see Bootstrap working as well when testing your application.

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

If you do not add the jquery.min.js script Bootstrap will not work.

Another requirement is popper.js if you need Bootstrap dropdown then you will need to install it and add the script file as well

npm install popper.js

Then add this script as well

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