Topic: How can I load mdb-progressive bar in anglar

tonyha premium asked 6 years ago


HI, I am MDB pro user. I have been tring to load ddb-progressiveBar several times, It does not work properly. I just copied it and pasted it into my project. I could not see any value in progressiveBar. I did just like this.
<mdb-progressbar value="0" min="0" max="100" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></mdb-progressbar>
<mdb-progressbar value="25" min="0" max="100" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></mdb-progressbar>
<mdb-progressbar value="50" min="0" max="100" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></mdb-progressbar>
<mdb-progressbar value="75" min="0" max="100" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></mdb-progressbar>
<mdb-progressbar value="100" min="0" max="100" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></mdb-progressbar>
            
However, I can not see any blue color on my browser. what I did wrong ?



Damian Gemza staff commented 6 years ago

Could you please show me your app.module.ts file and angular.json styles array? I've copied your code, and for me, everything is working fine. Best Regards, Damian

Chen Xiao pro answered 6 years ago


I check my code, find your progressbar component should add 'type="success"' in it.

tonyha premium commented 6 years ago

Thank you ! But, it does not work well!

Chen Xiao pro commented 6 years ago

Wierd, I have the same version as yours, it works. Btw, progressbar has a another trick: if you want to change the height of it , you should add below to the src/style.scss(top level css file): #pendingProgressBar { .progress-bar, .progress { height: 20px !important; } }


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Premium
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags