0

I'm learning Angular and I have a problem with Bootstrap and the dropdown.

The Bootstrap class loads well, but the dropdown does not work, that's what I did for my new project Angular:

npm install bootstrap jquery popper --save

And when I do a npm audit here is the result

https://codepen.io/Anduril53/pen/LoPgyz?editors=1010

styles in angular.json

"styles": [
          "src/styles.scss",
          "node_modules/bootstrap/dist/css/bootstrap.min.css"
        ],
2
  • And you also added jQuery, bootstrap and popper js to the angular.json file..! Commented May 4, 2019 at 10:49
  • no, not in angular.json Here is my file: codepen.io/Anduril53/pen/MdgzWm?editors=1010 Where should I add it? Commented May 4, 2019 at 11:32

2 Answers 2

0

Try it

https://github.com/lichunbin814/angular_bootstarp_dropdown

    "styles": [
      "src/styles.scss",
      "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"
    ],
Sign up to request clarification or add additional context in comments.

5 Comments

I try but here is the return when I do ng serve and npm install popper --save prntscr.com/nkbsl5
I find the answer. I install popper and not popper.js, so the problem is solved. By cons I have some dependency error, how to solve them easily?
I change the order of importing js file (popper.js have to before bootstrap's js)
The message were a problem with a dependence of bootstrap, but is now solved
-1

why are using bootstrap .. you can use Angular material it's an awesome framework for angular it has a many features and its easy to work with it . stpes: 1- install the pack npm install --save @angular/material @angular/cdk @angular/animations

2- integrate angular material to your project ng add @angular/material

3- restart the server (ng serve)

4- now you can use any component of angular material. this is the link https://material.angular.io/components/categories

5- for example if you want a dropdown you need to add the api (a module) of the select component in the app module after that you can use it in the all app .

to use the select component : 1- add the api in the app module import {MatSelectModule} from '@angular/material/select';

imports : [MatSelectModule]

2- go to the the any component on your project and add the component

heyy

1 Comment

The question is about bootstrap. If you want to propose another library, you can propose it in a comment but it's not an answer!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.