The first 100 people that buy one product, will get another one for free.

Material Dashboard Pro Angular

Material Dashboard Pro Angular

Premium Bootstrap 4 Angular 8 Template
· 4.90/5 (232 Reviews)

License

2,865 Downloads
586 Comments
Premium Support
6 months Updates
Release: 2 years ago
Update: 3 months ago

200 Handcrafted Elements

15 Customized Plugins

6 Example Pages

Bootstrap Based

Documentation

Fully Responsive

Product certified by: Creative Tim

Get Free Demo

Learn more about Material Dashboard Pro Angular in the light demo version. It has features from the full version. We hope you will like this introduction to this product!

What is in Demo?
  • Elements · 60
  • Plugins · 2
  • Examples Pages · 3
  • -
  • -
  • -
  • -
What is in PRO Version?
  • Elements · 200
  • Plugins · 15
  • Example Pages · 6
  • + Documentation
  • + SASS Files
  • + Photoshop Files
  • + Sketch Files
Get Free Demo

We are here to help you!

586 Web Developers commented on this product

Github Docs FAQ Page

matteopoli
  • downloaded
7 months ago

@chelaru_ciprian Hi, I'm using a component from this template called wizard. There is a comment inside .ts file of this component that say: // IMPORTANT: this is a plugin which requires jQuery for initialisation and data manipulation I have installed jquery but nothing works properly. I have an error that say ' $ is not defined ' but in my .ts file at line 8 i have inserted declare const $: any Have you got any idea to fix my problem? thank you very much

chelaru_ciprian
  • owner

Hi @matteopoli . Thank you for using our product. Have you imported the jquery js file in angular.json file at scripts: "node_modules/jquery/dist/jquery.js", ? All the best, Ciprian
7 months ago

matteopoli
  • downloaded

@chelaru_ciprian Thank you for the response. I found the problem. I need to import in my angular.json file these libraries: "node_modules/jquery/dist/jquery.js", "node_modules/popper.js/dist/umd/popper.js", "node_modules/bootstrap-material-design/dist/js/bootstrap-material-design.min.js", "node_modules/twitter-bootstrap-wizard/jquery.bootstrap.wizard.js", "node_modules/jquery-validation/dist/jquery.validate.min.js" Please think about create a guide in order to use your component. For example what css file need to copy and libraries to import. Thank you very much Best, Matteo
7 months ago

ithelpdesk
  • downloaded
7 months ago

Hi chelaru_ciprian , I have downloaded the angular material dashboard Pro, I have finished my final product and deployed it on iis server at my end . The problem i am facing is during the page refresh. Whenever I refresh the page its breaks and gives error like page not found. is there anything i need to do other than ng build --prod.

chelaru_ciprian
  • owner

Hi, @ithelpdesk . Thank you for using our product. Can you give me the link where you deployed it? And what errors do you get in the browser console? Best, Ciprian
7 months ago

ithelpdesk
  • downloaded

@chelaru_ciprian Sure. i will be sending you an email regarding this . Thanks!!
7 months ago

msdn_proat
  • downloaded
7 months ago

Hi chelaru_ciprian. Last Friday I downloaded your Angular Material Dashboard Pro (version 2.2.0). I get some warnings (WARN) when executing the following: - npm install -g @angular/cli >>> optional SKIPPING OPTIONAL DEPENDENCY: [email protected] and - npm install >>> npm WARN @agm/[email protected] requires a peer of... >>> npm WARN @ngtools/[email protected] requires a peer of... >>> npm WARN [email protected] requires a peer of... >>> npm WARN [email protected] requires a peer of... etc I think this could do no harm and I can just ignore these warnings. But when executing the "npm install" I also get 2 high severity vulnerabilities. - One about Cross-Site Scripting (XSS) / Package: jquery / Dependancy of: jqvmap - and one about Cross-Site Scripting / Package: bootstrap-tagsinput Can I also ignore these high severity vulnerabilities? Or?

msdn_proat
  • downloaded

Hi, @chelaru_ciprian. Thank you for your answers on my sidebar questions. Could you please answer this post. Is this just something to ignore or should I take some actions to solve this (the high severity vulnerabilities)?
7 months ago

chelaru_ciprian
  • owner

@msdn_proat you can ignore the warnings.
7 months ago

msdn_proat
  • downloaded
7 months ago

Hi chelaru_ciprian. In the documentation I cannot find a way to add a third level in the sidebar. And... I would also like to expand a menu and to link it to a certain page. So when a user clicks on the menu, the menu expands and the new page will be shown. Like a combination of menuitem.type "link" and "sub"

chelaru_ciprian
  • owner

Hi, @msdn_proat ! Thank you for using our product. If you check the sidebar.component.html file, at lines 105-108 you have the code for the submenu. Here you need to add [routerLink]="your_path". For the third level of the sidebar menu check thsi issue: https://github.com/creativetimofficial/ct-material-dashboard-pro-angular/issues/121. Tell me if you need more help. Best, Ciprian
7 months ago

msdn_proat
  • downloaded

Thank you for your reply. I've downloaded "multilevel-sidebar.zip" (from your link) and implemented the two files in the sidebar component folder. It doesn't expand the menu's that doesn't contain the third level children array. If I add the [routerLink]="your_path" to an expandable menu, it opens the link but it doesn't expand and show the child menu's. I don't understand the meaning of the "type" property. Why do you need to tell the menu (by setting the type to "sub") that it has child menu's? In my opinion, if the property "children?" is undefined it's a normal menu item. If the property is not undefined, it has child items.
7 months ago

chelaru_ciprian
  • owner

I implemented this some time ago. I'm open if you have a better solution.
7 months ago

msdn_proat
  • downloaded

Ofcourse I'm not going to create this myself :). For example, see: http://plugins.codershood.info/#/plugins/ngmm-plugin
7 months ago

aamada21
  • downloaded
7 months ago

Hello, I'd like to hide sidebar when width is more than 991 or 992px. I think, one is have to comment out line 457 to 461 in _sidebar-and-main-panel.scss, but I don't know where to hide sidebar itself in more than 991 or 992px width. Really appreciate if there are any ideas. Thanks

aamada21
  • downloaded
7 months ago

And if use hideSidebar() and if adjust browser less than 991px width, sidebar won't hide correctly. (If use minimizeSidebar(), it works when width is less than 991px)

chelaru_ciprian
  • owner

Hi, @aamada21 ! Thank you for using our product. You can use the hideSidebar() function and change these lines 579-601 from sidebar-and-main-panel.scss with @media screen and (min-width: 991px){ .hide-sidebar{ .sidebar{ @include transition-all($general-transition-time, $transition-linear); @include transform-translate-x(-260px); } .main-panel{ width: 100%; } &.sidebar-mini{ .sidebar{ @include transition-all($general-transition-time, $transition-linear); @include transform-translate-x(-80px); } } } .animation{ @include transition-all($general-transition-time, $transition-linear); } } Tell me if it works. All the best, Ciprian
7 months ago

aamada21
  • downloaded

@chelaru_ciprian Thanks for your quick response! It works on my side. But animation starting point is not appropriate in my environment. (Hiding animation starting point is double sized sidebar width to center). Is it same as your side? Cheers.
7 months ago

chelaru_ciprian
  • owner

@aamada21 go in navbar.component.ts and delete the lines 68-70.
7 months ago

raessen 7 months ago

@chelaru_ciprian thanks for your reply and the project.json. Regarding the charist.js question: Looking at their github they have not done any code changes for the past year, no release for the past 2 years, 32 outstanding PR's and a lot of issues. So don't you think this library should be replaced by another one within your template? One that is more maintained and also have more features? (looks like charist can't cross a line through a bar graph). Do you have any other alternative (one that works well with angular 7 too).

chelaru_ciprian
  • owner

Hi, @raessen . In the latest products, we used chart.js. Can you have a look at Now UI Dashboard Angular https://www.creative-tim.com/product/now-ui-dashboard-angular. Best, Ciprian
7 months ago

natashaolson 7 months ago

@chelaru_ciprian How do I set the default theme color to white instead of red?

chelaru_ciprian
  • owner

@natashaolson thank you for using our product. You want all the red color to be white or just the sidebar? Best, Ciprian
7 months ago

natashaolson

@chelaru_ciprian both, so I can know how to freely customize everything.
7 months ago

natashaolson

@sandisooto follow
7 months ago

chelaru_ciprian
  • owner

To do that, you need to go in the HTML pages(ex: admin-layout.component.html and change the data-background-color from line 3 to 'white' to make the sidebar background color white). You need to do like that for the rest of the pages, too.
6 months ago

pankajitengg 7 months ago

I want to Buy HTML Personal License .. Can you please explain whats include in this and can you also share the demo link for complete features

chelaru_ciprian
  • owner

Hi, @pankajitengg . Thank you for your interest in our products. On the package level (archive that you receive) there is no difference. The difference is only in what you can do with that package. For example a Personal License allows you to use our product for a personal website/app, for your startup or for a single client, while the Developer License allows you to create multiple websites/apps for different clients, for a SaaS application where you charge your users for using the product and also create themes/templates for sale. The themes/templates that you build cannot look as the original product, you need to change images, text, elements orders etc. More about the licenses can be found here: _http://creative-tim.com/license_ (http://creative-tim.com/license) All the best, Ciprian
7 months ago

lduarte
  • downloaded
7 months ago

@chelaru_ciprian Hello Im have error https://github.com/creativetimofficial/ct-material-dashboard-pro-angular/issues/309 Help me

chelaru_ciprian
  • owner

@lduarte sorry for the late response. You can check my response now. Best, Ciprian
7 months ago

You have to be logged in to post a comment. Login here.