Do you need Angular, React, Vuejs or HTML? For the next days, you can get our awesome Bundles with 70% discount! 🔥

Material Dashboard Pro Angular

Material Dashboard Pro Angular

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

License

2,772 Downloads
574 Comments
Premium Support
6 months Updates
Release: 2 years ago
Update: 13 days 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!

574 Web Developers commented on this product

Github Docs FAQ Page

fish
  • downloaded
2 years ago

Any chance on getting an update on the typescript version?

alexpaduraru
  • downloaded

We just updated it to v1.2.0 on CLI. Please check it and let us know if you have any feedback. Best, Alex!
2 years ago

efriandika

That's not ts version. You just move your jquery code from js file to ts file.. There is different with the before version..
2 years ago

ada.luo
  • downloaded
2 years ago

for the cli version, you should probably put all your js files and css files in angular-cli.json scripts section and styles section. cli will bundle them for you.

alexpaduraru
  • downloaded

@ada.luo thank you for the suggestion. This is what we did and everything seems fine :D Please let us know if you have any further feedback. Best, Alex!
2 years ago

tony.montanajan
  • downloaded
2 years ago

Hey @alexpaduraru , - is this written using javascript or typescript? also, where the documentation for it? I've been looking for it, but can't seem to find it.

alexpaduraru
  • downloaded

@tony.montanajan thank you for using our product. The CLI Version is using Typescript, we are trying to move 100% to the CLI and remove completely the plain Angular 2 version which was using Javascript in the next release.
2 years ago

tony.montanajan
  • downloaded
2 years ago

oh yeah my other question was, how easy will it be to integrate any updates?

alexpaduraru
  • downloaded

@tony.montanajan at this moment the best option will be to replace the package.json and angular-cli files with the new ones and the assets/css/material-dashboard and assets/scss/ with the new ones. In the future we will find a way to change just 1 version of the MD Pro Angular and everything will be done automatically. Do you have any ideas about this? Best, Alex!
2 years ago

mittwillson
  • downloaded
2 years ago

if i build for myself and people use it but can't get it source, should i use developer license or personal one? and if i build many websites for myself, they also can't get source, witch one choise is better?

alexpaduraru
  • downloaded

Anonymous Tim thank you for your interest in our product. If you build just for yourself the Personal License is enough. If you charge your users for using what you build, then you need a developer License. Please let us know if we can give you any other information. Best, Alex!
2 years ago

mdb87
  • downloaded
2 years ago

has anyone used a material design style FAB button with this template and can recommend one to use?

alexpaduraru
  • downloaded

@mdb87 we have the btn-fab style created, you can see it inside the componets -> buttons, the one with the small heart icon. What you need to do next is to create a "btn-fixed" class which will keep the button on the display, no matter how much you scroll. So please create this class .btn-fixed{ position: fixed; bottom: 20px; right: 40px; z-index: 3;} and then add it on your btn-fab button. Also make sure you add the button outside of the main-panel area so it will stay fixed on the screen. Please let us know if you've got it working fine. Best, Alex!
2 years ago

adminhec
  • downloaded
2 years ago

At which point will you get completely rid of jQuery? Is there an ETA? Even if there aren't certain plugins on angular you could always create directives yourself. Could you make a list of which of your components depend on jQuery? I'm sure nobody will use all components so maybe you could make a pure angular version now that doesn't offer components relying on jQuery so you could leave it out there. It just isn't good to have jQuery alongside angular.

untel
  • downloaded

Yeee i agree ! That could be cool to have all components encapsulate, each one with their own logic
2 years ago

alexpaduraru
  • downloaded

@adminhec @untel the current version v1.2.0 is the most stable that we have. At this moment all the plugins that we have (full calendar, datatables, alerts, maps, wizards etc.), are using jQuery and they don't have a pure native Angular version. We've talked with the creators of those plugins and they don't have any interest in migrating them to pure Angular, but they created, as you suggested, encapsulated versions which can be installed from the npm and work fine in the Angular projects. The only issue here is that they are still depended on the jQuery library. We are waiting now to see how what is gonna happen with the current jQuery libraries and if the developers want to migrate them to Angular, and we will definitely want to use only pure Angular libraries. We will also look for the Angular Community to see if there are similar components like the one that we used and try to replace them. Hope this information helps you. I can add on your account the CLI Version so you can check the current structure and how the plugins are integrated using Typescript. Then, if everything is fine you can get a license. Best, Alex!
2 years ago

adminhec
  • downloaded

Hello, we're already having a dev license for the product but we can't use it because it depends heavily on jQuery. Can't you publish a strip-down version for angular CLI that excludes all jQuery dependent components so jQuery can be removed there as well?
2 years ago

alexpaduraru
  • downloaded

@adminhec should that non-jQuery version have only the Style? I don't think I understood perfectly. Can you please let us know what exactly the non-jQuery version should contain if the current implementation is using a lot of jQuery based plugins? Best, Alex!
2 years ago

adminhec
  • downloaded

@axelut the non-jQuery version should have the styles plus all components that do not rely on jquery.
2 years ago

mittwillson
  • downloaded
2 years ago

maybe can support lazyLoad and "loading"? it's large and very slow when i tried load even localhost

alexpaduraru
  • downloaded

Anonymous Tim thank you for the information. Can you please let us know which is the best option to do that and if you have any good/working example? There are a lot of people talking about this on Stackoverflow and other places and everybody is doing that different. We want to make sure that we are implementing a tested way for production. Best, Alex!
2 years ago

joe.lee
  • downloaded
2 years ago

A component should be encapsulated . ( html / css /ts ) . That is the quickest way to let developers using your awesome theme ... The source code still mixing with jQuery and the styles ( which is what I need ) is all plug in one css file ... ( material-dashboard.css ) .

joe.lee
  • downloaded

@alexpaduraru umm... Not quite . I will use angular-cli as example to explain my point . If anyone found that I am wrong or there is a better way , please feel free to comment . In Angular 2 , there are two type(scope) of css , one is global , another is some.component.css . The global one is under src/stlyes.css (angular-cli project) . The global css fit for some global styling for your theme , maybe font-family / basic card styles .... sth. like that . The another comes alone with the component , using angular-cli command : [ ng generate component ] automate generate for you . This css styling will only work inside this component . In your example , it should be a widget , a form , a table , an info-card .... So if developer want use your "Employess Status" component located in Widget ... I only need to look in how you style this component & your typescript code to control the component if there's any ( like modal / alert ) . Its fast and steady for developer implement the component in their own project .
2 years ago

alexpaduraru
  • downloaded

@joe.lee got it, thank you for the feedback. We will see how we can do this in the next releases, I think the best option would be to split the current SASS into different files and import them only when needed. Am I right?
2 years ago

joe.lee
  • downloaded

Of course I still need to copy-paste your global styling in my project . For this I recommend using Vanilla CSS. Because not every developer use SCSS or LCSS . I guess the audience of your product have fair amount of developers doesnt expert in CSS ( I am a rookie in CSS ). We purchase a well styled template / theme for quick implement our own project , so we can focus on writing TS/JS , wiring up data . Hope this will help
2 years ago

joe.lee
  • downloaded

Of course I still need to copy-paste your global styling in my project . For this I recommend using Vanilla CSS. Because not every developer use SCSS or LCSS . I guess the audience of your product have fair amount of developers doesnt expert in CSS ( I am a rookie in CSS ). We purchase a well styled template / theme for quick implement our own project , so we can focus on writing TS/JS , wiring up data . Hope this will help
2 years ago

joe.lee
  • downloaded

I am not sure if component.css can be written in scss . I do know angular-cli support scss as global . Still , use Vanilla CSS XD
2 years ago

alexpaduraru
  • downloaded

@joe.lee thank you for the great feedback! Now I got it, I perfectly understand what you pointed out. So taking this into consideration we have to think at the best option to split the current components and see which works better in terms of CSS/VanillaCSS and the generation for the components using CLI Interface. We will see what we can do in this area and will give you a beta version to make sure that we are going on the right path. Thanks for the explanation!
2 years ago

ada.luo
  • downloaded
2 years ago

@alexpaduraru Glad to see the cli version came out! Good job! At the first glance though, I found the datatable is not working as expected in the cli version. Can you please take a look?

alexpaduraru
  • downloaded

@ada.luo thank you for pointing out. We will check it and come back with a fix in 1 day. Keep in touch, Alex!
2 years ago

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