Angular 12 tutorial in Hindi #23 how to use Bootstrap with angular
ฝัง
- เผยแพร่เมื่อ 13 มิ.ย. 2021
- In this angular 12 version video, we learn how to make toggle element and show hide HTML tags in angular 13. This video is made by anil Sidhu in the Hindi language.
What is Bootstrap
How to install Bootstrap
Check Changes after install bootstrap
Add example of bootstrap
Interview Question
Angular 13
code link github.com/anil-sidhu/angular...
React js Latest Playlist in hindi : • React tutorial for beg...
inst id: @code.steps
![[LIVE] : ONE ลุมพินี 73 วันนี้!! คู่เอก "วรพล vs พันฤทธิ์"](http://i.ytimg.com/vi/rrOljlqse3A/mqdefault.jpg)
Thank you Anil for such a fantastic teaching. I started angular series and reached to this point. I must say, this series is perfect for beginners.
Excellent lesson !!!
Thank you sir 👍👍
Thanks a lot sir
Those who is facing issue of not bootstrap,..
just after running adding bootstrap command, again restart "ng serve" in your terminal
it will work !.
Yeah It worked!
Hi, i agin add bootstrap in the same terminal then run ng serve command but still it not working.Please help me.
Nahi ho raha hai 13version main kuch solution batao
hello brother
bootstrap not installing my angular page and error show
not able to fnd code for this video on github
Hi sir i am using Angular16 version,when i am trying to install bootstrap in my project then it not working.Please help me.❤❤
Try " npm install bootstrap " it worked for me as I also have version 16
Boss
1. ng add @ng.bootstrsp/ng.bootstrap
By yr video of bootstrap
2 ng add @ng-bootstrap/ng-bootstrap
By website
1. Is not working giving errors
2 is installed completely
IS THRER ANY DIFFERENCE IN BOTH COMMANDS
PLS RE PLY
Thanks and best regards
Bootstrap is not getting installed
Bro version 13 mein bootstrap error araha hai
tried everything but still its not working
Aap ne to ts ki file dikhai bhi nahi
Error solution:
npm install @ng-bootstrap/ng-bootstrap --force
?]633;P;IsWindows=?]633;A?]633;P;Cwd=C:\x5cUsers\x5cSaqlain\x5cDesktop\x5cNew folder\x5cprojectPS C:\Users\Saqlain\Desktop\New folder\project> ?]633;......how can i fix that error
Sir Bootstrap install nhi ho rha h err massage aarhi hai
bootstrap download krne m error aa rha h can you help me
:)
Yedya nit sang
First way: Install bootstrap in your angular 12 app like below. This is only for css importing.
npm install bootstrap --save
Now you need to import bootstrap css in style.css file like this:
@import "~bootstrap/dist/css/bootstrap.css";
Second way: Install bootstrap with jquery and popper js like below and thus you can import bootstrap css and bootstrap js function.
npm install bootstrap --save
npm install jquery --save
npm install popper.js --save
After successfully run the above commands import it in angular.json file like this:
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.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"
]
Now you can easily use bootstrap class, css, js as expected :)
i installed bootstrap using this command- ng add @ng-bootstrap/ng-bootstrap - but it didn't work for me. plz jelp what to do
restart the terminal
my Cli versions are this :-
Angular CLI: 12.0.5
Node: 14.17.0
Package Manager: npm 7.17.0
OS: win32 x64
Angular: 12.0.5
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1200.5
@angular-devkit/build-angular 12.0.5
@angular-devkit/core 12.0.5
@angular-devkit/schematics 12.0.5
@schematics/angular 12.0.5
rxjs 6.6.7
typescript 4.2.4
Anil, I am still getting this Error.
Microsoft Windows [Version 10.0.19043.1052]
(c) Microsoft Corporation. All rights reserved.
D:\tp_angular\frontend>npm install @ng-bootstrap/ng-bootstrap@next
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: frontend@0.0.0
npm ERR! Found: @angular/common@12.0.5
npm ERR! node_modules/@angular/common
npm ERR! @angular/common@"~12.0.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^11.0.0" from @ng-bootstrap/ng-bootstrap@11.0.0-beta.1
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! @ng-bootstrap/ng-bootstrap@"11.0.0-beta.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Rahul\AppData\Local
pm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Rahul\AppData\Local
pm-cache\_logs\2021-06-21T08_31_40_623Z-debug.log
D:\tp_angular\frontend>
solution is also given in err bro... use --force or --legacy-peer-deps
@@thunder5323 npm config set legacy-peer-deps true
The package @ng-bootstrap/ng-bootstrap@10.0.0 will be installed and executed.
Would you like to proceed? Yes
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: blog@0.0.0
npm ERR! Found: @angular/compiler@12.1.5
npm ERR! node_modules/@angular/compiler
npm ERR! @angular/compiler@"~12.1.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler@"12.2.0" from @angular/localize@12.2.0
npm ERR! node_modules/@angular/localize
npm ERR! peer @angular/localize@"^12.0.0" from @ng-bootstrap/ng-bootstrap@10.0.0
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! @ng-bootstrap/ng-bootstrap@"10.0.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm config set legacy-peer-deps true
@@ayushgarg2442 thanku
I also get the error :
The package @ng-bootstrap/ng-bootstrap@13.1.1 will be installed and executed.
Would you like to proceed? Yes
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: boot-test@0.0.0
npm ERR! Found: @angular/common@15.0.1
npm ERR! node_modules/@angular/common
npm ERR! @angular/common@"^15.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^14.1.0" from @ng-bootstrap/ng-bootstrap@13.1.1
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! @ng-bootstrap/ng-bootstrap@"13.1.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! C:\Users\DIN\AppData\Local
pm-cache\_logs\2022-11-28T17_09_03_541Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\DIN\AppData\Local
pm-cache\_logs\2022-11-28T17_09_03_541Z-debug-0.log
× Packages installation failed, see above.
I tryed npm config set legacy-peer-deps true but didn't solve.
please give me some solution
@@ayushgarg2442 thank you so much