md-data-table | Material Design Data Table for Angular Material | User Interface library

 by   daniel-nagy JavaScript Version: Current License: MIT

kandi X-RAY | md-data-table Summary

kandi X-RAY | md-data-table Summary

md-data-table is a JavaScript library typically used in User Interface, Angular applications. md-data-table has no bugs, it has no vulnerabilities, it has a Permissive License and it has medium support. You can install using 'npm i pz-angular-material-data-table' or download it from GitHub, npm.

Material Design Data Table for Angular Material

            kandi-support Support

              md-data-table has a medium active ecosystem.
              It has 1927 star(s) with 542 fork(s). There are 91 watchers for this library.
              It had no major release in the last 6 months.
              There are 278 open issues and 290 have been closed. On average issues are closed in 354 days. There are 28 open pull requests and 0 closed requests.
              It has a neutral sentiment in the developer community.
              The latest version of md-data-table is current.

            kandi-Quality Quality

              md-data-table has 0 bugs and 0 code smells.

            kandi-Security Security

              md-data-table has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.
              md-data-table code analysis shows 0 unresolved vulnerabilities.
              There are 0 security hotspots that need review.

            kandi-License License

              md-data-table is licensed under the MIT License. This license is Permissive.
              Permissive licenses have the least restrictions, and you can use them in most projects.

            kandi-Reuse Reuse

              md-data-table releases are not available. You will need to build from source code and install.
              Deployable package is available in npm.
              Installation instructions, examples and code snippets are available.
              md-data-table saves you 398 person hours of effort in developing the same functionality from scratch.
              It has 946 lines of code, 0 functions and 29 files.
              It has low code complexity. Code complexity directly impacts maintainability of the code.

            Top functions reviewed by kandi - BETA

            kandi has reviewed md-data-table and discovered the below as its top functions. This is intended to give you an instant insight into md-data-table implemented functionality, and help decide if they suit your requirements.
            • Build a message dialog dialog .
            • 6 - md - select
            • The md - table controller
            • Controller for the md - pagination controller .
            • compile head control
            • Compile the md - column directive
            • Set controller for submit
            • The md - cell wrapper
            • Positions the dialog .
            • Virtual page selectors
            Get all kandi verified functions for this library.

            md-data-table Key Features

            No Key Features are available at this moment for md-data-table.

            md-data-table Examples and Code Snippets

            No Code Snippets are available at this moment for md-data-table.

            Community Discussions


            AngularJS: How to freeze orderBy in ng-repeat during edit mode
            Asked 2019-Aug-08 at 14:17

            I'm using md-data-table and I have add sorting options based on column. Below, presented my html(pug format) code:



            Answered 2017-Feb-28 at 10:18

            Outsource your orderBy logic into your controller and make it block in edit mode by using a simple switch variable like in this example fiddle. I hope this working example will help you to implement this logic inside your application.



            Table angular material pagination does not work as expected
            Asked 2018-Jul-27 at 06:33

            I am creating a table using Angular Material Table

            I want the table to have pagination so that user can go to preferred page and rearrange page to be displayed, something like this one:

            Material data table

            Here is what I have so far:




            Answered 2018-Jul-26 at 20:47

            Try this piece of code:



            How to sort column with dates on md-data-table using md-order-by attribute
            Asked 2018-May-20 at 14:04

            I'm trying to allow ordering a column of a md-data-table in AngularJS that contains dates. These dates are strings with the format DD / MM / YYYY. I can not get them ordered correctly. I have tried to call a function that returns the timestamp of the date from the md-order-by attribute, but it does not even call the function. The current code is the following and the column that I am trying to order is Fecha Nacimiento:



            Answered 2018-May-20 at 14:04

            Calling function on md-order-by doesn't work. So what you'll have to do, is changing date property of objects. You saying you receiving it in the form of DD/MM/YYYY string right? So just manipulate array & change date property to object with its own properties as value & ts (timestamp) in the view you can bind the date.vale & in md-order-by you can bind date.ts.

            For manipulation I've created one example with function as:



            Fill Material Design Data Table in AngularJS with Firebase data
            Asked 2018-May-05 at 11:07

            I am trying to use this module of AngularJS to create a table with information stored in Firebase. The problem is that I can not get the table populated with the data obtained in Firebase. At the moment of loading the page, the progress bar appears, but when it finishes receiving the Firebase information and the progress bar ends, nothing is shown in the table. It remains as you can see in the following image, it also shows how the information is loaded, since it is being printed by the console.

            The table has the following structure:



            Answered 2018-May-05 at 11:07


            Specify separator for mg-table-pagination AngularJS
            Asked 2017-Oct-31 at 12:05

            Consider the image of a table produced from

            I want to change the way pagination is displayed, as it is typographically incorrect. It should display

            1–5 of 9

            no whitespace between 1 and 5, and en-dash as separator.

            According to, the functionality probably should be located in md-label, but there's only three properties to the object: of, page and rowsPerPage.

            Is there a way to achieve this? doesn't supply a solution.



            Answered 2017-Oct-31 at 12:05

            One solution is to modify the md-data-table.js library with your custom html template. Download the script and modify below section as



            Trigger ng-show when json data changed
            Asked 2017-Sep-22 at 17:56

            I'm trying to hide the upload button and display a new edit button when the user uploads a file. I'm using angular-file-upload and md-data-table libraries. I use the test function in order to save the row that was clicked and then after the file is uploaded I change the uploaded value inside the json. It changed the value to true in the user_doc json object but it doesnt hide the buttons in the html

            This is a snip from my html



            Answered 2017-Sep-22 at 17:56

            Just replace uploaded values mentioned inside ng-repeat by row.uploaded:



            Unable to do bower install
            Asked 2017-Apr-25 at 10:25

            I am trying to install angular-material-data-table using bower. When I run bower info on it, I get 0.10.9 and 0.10.10 as versions. But when I try to install those specific versions, it gives ENORESTARGET error.

            I thought it was a cache issue so I tried to use --force option too. I even tried to install without mentioning any specific version to get the same error. Am I missing something here?

            Here's the bower info and bower install command output -



            Answered 2017-Apr-25 at 10:25

            I was getting the error due to having a different dependency in my bower.json having branch set as undefined



            How to improve JS files loading performance (AngularJS)?
            Asked 2017-Mar-21 at 13:14

            I have a problem with my web performance the problem is that I have a delay when page is loading view.

            I checked development tools in Chrome, and I see that most time of load taking angular.js, angular-material.js and also angular.material.css.

            See image below

            There is how I am adding libs.



            Answered 2017-Mar-21 at 12:31

            Check the following things to improve performance

            • You are using development version of these libraries .. use minified versions. Go to the folder and find angular.min.js and include that. Similarly, for all libraries use minified versions.
            • Enable gzip compression on web server to further reduce the size.
            • Enable resource caching (Add Caching headers) to cache resources locally , so, that it won't get downloaded next time.
            • Add async & defer to script tags to avoid render blocking download of resources.



            Sorting only current page md-data-table
            Asked 2017-Feb-22 at 15:51

            I'm trying for hours to figure out why is my md-data-table only sorting the current page.
            The same thing is happening on the search filter.
            Can someone say why is it doing this and how can i fix it?



            Answered 2017-Feb-22 at 15:51

            Maybe change the order of the filters?

            Also; this is in the documentationof mg-data-table:

            My Pagination Isn't Working?!

            Make sure you pass md-page, md-limit, and md-total to the directive and that they are finite numbers. Pages are not zero indexed. The directive will assume pages start at one. If your query language expects pages to be zero indexed then just subtract one before making the query.



            Simple login page - form method post doesn't work
            Asked 2017-Feb-20 at 01:58

            Hello I have simple login page which works fine when I am using bootstrap but I want to use angular material design.

            I am looking for problem from 3-4 hrs and nothing. I think that form doesn't send any data like username, password and submit

            There is full code of login



            Answered 2017-Feb-19 at 21:03

            Community Discussions, Code Snippets contain sources that include Stack Exchange Network


            No vulnerabilities reported

            Install md-data-table

            This package is installable through the Bower package manager. In your index.html file, include the data table module and style sheet. Include the module as a dependency in your application. In addition, this package may be installed using npm. You may use Browserify to inject this module into your application.


            Tables are sorted alphabetically by their first column. I will be camelCasing attributes in tables (otherwise the cells would wrap and be difficult to read) but don't forget to kebab-case them in your template.
            Find more information at:

            Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items

            Find more libraries
          • HTTPS


          • CLI

            gh repo clone daniel-nagy/md-data-table

          • sshUrl


          • Stay Updated

            Subscribe to our newsletter for trending solutions and developer bootcamps

            Agree to Sign up and Terms & Conditions

            Share this Page

            share link