Stack Overflow
Stack Overflow

Questions tagged [angular-material-table]

An Angular component that provides the Material Design styled data-table. For displaying tabulated data. Also, include [angular] and [angular-material] tags when posting the question.

The Material Data Table component is a generic component for displaying tabulated data.

Useful Links:

https://blog.angular-university.io/angular-material-data-table/

https://material.angular.io/cdk/table/overview

https://material.angular.io/cdk/table/api

528 questions
0
votes
1 answer

Optimize button width based on content/label

Below is the screenshot of HTML source code, in that a button occupying more width than the content in it. Highlighted in yellow having space at right side of the button. I know its because of multi-line. Is that expected behavior across browsers,…
peterkr
  • 423
  • 2
  • 7
  • 22
0
votes
0 answers

Angular5CSV formatting directly with a delimiter in excel?

I've been using https://www.npmjs.com/package/angular5-csv to export my material data table to CSV format. I used the ',' field seperator but in excel you actually have to convert data using the delimiter, and I would like to know if it's possible…
Mich
  • 182
  • 3
  • 6
  • 21
0
votes
1 answer

Material Table not getting populated

I am fairly new to Angular. I am developing a search page which has 2 components. "search" and "searchtable" . searchtable is using Material table. I am trying to populate the material table with data from HTTP get.However Material Table only…
Rahat Saini
  • 311
  • 1
  • 4
  • 15
0
votes
1 answer

Angular6 Material table multiple filter not working

I am developing an Angular6 application with angular material. Now facing a problem with filter data from mat-table result using multiple values. I didn't get any value in the table after filter from form group. Is this correct way what I am…
imjayabal
  • 805
  • 1
  • 12
  • 24
0
votes
1 answer

Set focus on input field after click in table column (Angular 7)

I have the problem, that I need the focus on the clicked column field in my table. I always have to click two times on the field to modify the content in the input field. HTML:
yuro
  • 2,189
  • 6
  • 40
  • 76
0
votes
1 answer

Retrieve firebase list data to create a dynamic table

I want to push the values into a array like below when i retrieve values from firebase database columns: any[]; this.columns = [ { columnDef: 'FirstName', header: 'First Name', cell: (element: any) => `${element.FirstName}` }, { columnDef:…
DEV
  • 949
  • 1
  • 9
  • 29
0
votes
1 answer

generate json array object or json object from angular material table

Actually the requirement is to generate json array object or json object from angular material table so that I can use this object and export to Excel sheet. Below is the data. const ELEMENT_DATA: Element[] = [ {position: 1, name: 'Hydrogen',…
Akshay Uttur
  • 75
  • 1
  • 8
0
votes
1 answer

Angular Material table data source not displaying data

I am trying to create a table of stock quotes using the IEX trading api. However, I am having issues trying to hook it up to the datasource. I am able to use an ngfor and display the data, but data is not being displayed when trying to use the…
Ownage
  • 45
  • 4
0
votes
1 answer

Angular Material table spec

I have a component that render a table using Angular Material mat-table. It is working fine, but in my spec file the table does not render the elements of the body (tds and trs), so the test fails. It seems that I initialize the text correct, I…
gad
  • 11
  • 1
  • 3
0
votes
1 answer

Material Angular Mutliple table dataSource + Material Angular Mutliple table in single template 'Could not find column with id'

I want to have two tables in tabs on the same page. The tabs are working fine. If I comment out one of the tables in HTML, then the single table is loading, and when I view the data with console.table, the data also works. But in HTML it is giving…
user2865935
  • 1
  • 2
0
votes
4 answers

Angular Material Table Sorting - Data Doesn't sort when inside a *ngIf condition

I have a Angular Material Table. When I surround html for the table with a
the table renders but the data no longer sorts when clicking on the header column. Taking the example from:…
Thomas Jahncke
  • 116
  • 3
  • 6
0
votes
0 answers

Angular material: How to apply sort for table with multiple value in each cell

I use Angular material to make a table whose columns contain multi property value from [dataSource]. I want to make sort for each property in columns. When click to an arrow correspond to a property in a column, the table will be sorted immediately…
Xuan Quang Nguyen
  • 1
  • 2
0
votes
0 answers

How can I have different operations in desktop and responsive view in angular material table row?

Screenshot of the code I am using a mat table and in that mat table in mat-row, i want to route to another component in desktop view and expand the row in mobile view and in this I am using multiTemplateDataRows , but I am getting one extra blank…
Amit Kumar
  • 1
  • 1
0
votes
0 answers

Data isn't refreshing properly on Angular Material Table in a Material Tab

I'm following a video tutorial building a contact manager app on Angular Material Design that was designed for version 5 of Angular and Angular Material but I'm using Angular 7.0.4 and Material 7.2.0. I'm implementing Material tabs with two tabs…
Rezenalize
  • 59
  • 1
  • 10
0
votes
0 answers

Angular material 6 flex table resizing column individually with the resize symbol

I am trying to make the angular material 6 flex table's individual columns as resizable. I have used a method resize where in the column width I am assigning, but all the columns are resizing when I try to resize one column. Here is the…
Shreelakshmi G
  • 119
  • 2
  • 16
1 2 3
…
35 36