Stack Overflow
Stack Overflow

Questions tagged [mat-table]

Angular Material - mat-table

The mat-table provides a Material Design styled data-table that can be used to display rows of data.

607 questions
2
votes
1 answer

Angular UI Freezes when using formArray with Material Auto-complete inside Mat-table

I'm using a mat-table inside a popup. Inside the mat-table there will be rows with mat-autocomplete. The thing is I need to add rows dynamically. I'm using a formGroup inside which there is formArray. this will be the Model of the FormGroup { …
Stephen26
  • 84
  • 5
2
votes
1 answer

Convert XLS(x) data to Angular Material Data Table

I am working on a project where I need to import data from an Excel spreadsheet (eventually, multiple sheets), and I want to display the data in an Angular Material datatable. I can load the Excel data into my component as csv, json, html, or text…
lsieting
  • 85
  • 2
  • 13
2
votes
1 answer

Mat-Table overlapping menu above when scrolling

I've got a mat-toolbar placed above a mat-table inside a mat-tab, I'd like to keep the toolbar and the table headers visible at all times, however, when I scroll down the page, the toolbar becomes overlapped with the table. The headers scroll up to…
expenguin
  • 1,052
  • 2
  • 21
  • 42
2
votes
1 answer

How to change Angular Mat table head row Background color, font etc

I have been attempting to make an Angular Mat table and I have it working, but I cannot figure out how to customize the header row. I need to change the background color and text color. I cannot figure out how to do it. Any help? Thanks!
Kevin Wilde
  • 81
  • 2
  • 9
2
votes
2 answers

Mat-Card in Mat-Table does not take up full width with overflow: x

I have inserted a mat-card in mat-table and set the width to width: 100%. But when i scroll with overflow: x from left to right not the whole wrapper is filled with the mat-card. Do you have an idea what I have to optimize in CSS? My Code: //…
user10114552
2
votes
2 answers

Why mat-sort not work with computed column?

Ciao, I'm working with Angular 8 and I've a problem sorting "computed" columns. Assuming that I have a object with two properties name and description, the sorting not works if I try to concatenate the value with a function inside the .ts file. This…
ilMattion
  • 1,841
  • 2
  • 24
  • 47
2
votes
0 answers

Angular mat table not updating when using observable

Im having issues with the mat-table not loading any new data after it has been initially created. I have changed from a regular html table using a ngFor to generate the rows which was working fine with the same data source. This is the mat-table…
oorkyy
  • 57
  • 1
  • 1
  • 7
2
votes
1 answer

mat-table how to align mat-header with the mat-cell width

I'm new with flex and I have quite made good with my mat-table. Unfortunately my header is not following my cell width. Here's a picture of my result. As you see my header is not align with my cell. Here's my CSS code, Like I said I'm new, so…
baronming
  • 210
  • 1
  • 3
  • 19
2
votes
1 answer

Limited the decimal places to 2 in mat-table

I would like to use the decimal pipe to limited the decimal numbers in my mat table. Can you please tell me how to do that? My Table: My Code: // html
user10114552
2
votes
3 answers

Angular- Material table sorting not working in proper way

I'm creating a table that should sort by file name and date I followed the Angular Material documentation for this purpose but is not working, it's not showing any errors in the compiler or the browser console, the table looks like this:
Alan Alvarez
  • 37
  • 1
  • 4
2
votes
1 answer

How can I change the style in mat-toolbar-row?

I'd like to make some changes to the code below... Unfortunately it does not work :( Can you please tell me what I need to add to my code. // Standard style from Angular Material .mat-toolbar-row, .mat-toolbar-single-row { display: flex; …
user10114552
2
votes
0 answers

How to add a total row for each grouped row Mat-table angular?

I've been following below stackblitz from @lujjian98 on grouping by rows into expandable panel for mat-table https://stackblitz.com/edit/angular-material-table-row-grouping I've been trying to add a total row in earch grouped rows. Can anyone advise…
WebDev
  • 151
  • 1
  • 1
  • 8
2
votes
2 answers

Firestore Observable or Promise

I have a Firebase firestore collection and I can retrieve data from it using the construct db.collection('myCollection').get().then(res => ...) That works fine, it returns data. But I use a @angular/material table and that component expects to…
Marc
  • 401
  • 1
  • 5
  • 15
2
votes
1 answer

Dots in bracket to access nested property

Consider the object below: var item = { id: 'some-id', price: 12, customer: { id: 'fake-id', name: 'fake-name' } }; We can access the customer name using "dots" or "brackets" as…
A-Sharabiani
  • 17,750
  • 17
  • 113
  • 128
2
votes
1 answer

How can I refresh Angular Material Table data back to it's initial state within the page?

Some notes: My goal is to implement some "discard" and "save" changes type of functionality. The "companyService" service calls an api which fetches the top "X" companies (in this case, 5) from a database. The table gets populated through a…
nsquires
  • 899
  • 2
  • 8
  • 20
1 2 3
…
40 41