1,151 questions
0
votes
0
answers
15
views
How can I defer loading of rows in a table using Angular to reduce lag in large tables?
I have a found multiple scenarios where either 100s of rows of data need to be loaded or 10s of rows need to be loaded but they all have many components inside. Is there a way to dynamically load only ...
1
vote
1
answer
82
views
Filter by date column in Angular Material table
I want to add a filter for a date column called Delivery Date in an Angular Material table that I am working on.
I added an input field above the table to filter by Delivery Date and an applyFilter ...
- 157
0
votes
0
answers
25
views
Single Checkbox in Mat-Table in Angular Strange Behavior
Situation:
I have a table with a [dataSource]="dataComision"
form that has a text input where a percentage is entered. Within the table, we have a checkbox, and when checked, all records in ...
2
votes
0
answers
100
views
Angular Material Table - Extend column definition to prevent code duplication
We have a custom mat table to support various features, like sort, filter, value piping, drag drop, inline editing and more. Now we want to support displaying trees in the table. It's done so far. The ...
- 513
1
vote
0
answers
54
views
How to prevent rotated mat-table headers from being overlapped by adjacent columns?
In my Angular app, I’m using mat-table with some long column names. To improve readability, I applied a rotate(-30deg) transformation to the header labels. However, this causes the labels to be ...
- 77
0
votes
2
answers
79
views
Can't change table size
I am trying to create a table and have it on the right side of the screen but I just can't get it to change size so it doesn't take up the whole screen without making everything become unaligned.
<...
- 23
1
vote
1
answer
87
views
How put an id(like index value) on a tr
I need to put an id that represent that number of row in my tr
I put this code
<tr mat-row *matRowDef="let row; columns: _columns;let i = dataIndex;" [id]="i"></tr>
...
- 497
1
vote
1
answer
129
views
Angular 18 mat-table with border radius and row-hover
Version: angular and angular/material 18.2.8.
I currently implemented my tables like this:
styles.scss:
table {
background-color: transparent !important;
}
.table-card {
margin-top: 20px;
...
- 922
1
vote
1
answer
96
views
How to update angular mat-table if the drawer is in another component?
Main component has tabs, component A, B etc.
My component_A has preloaded data but I have a button for filter.
I have a button that toggles a drawer from another component (main component).
...
- 13
2
votes
1
answer
951
views
Angular Material Table - How to specify the width of a column
<mat-tab class="StatusTab" label="Status">
<mat-table class="table mat-elevation-z10" [dataSource]="statusDetails">
<ng-container ...
- 19
1
vote
2
answers
236
views
Angular Material - How to display data with the loop in the mat-table
I use the Angular Material table to display records inside a loop. According to my code, only one record is getting displayed. However, two records are coming from the response. Please review my array ...
- 253
0
votes
1
answer
170
views
Mat Table using titles of header with spaces
I am using Angular material with "mat-table" and I want use titles of header with spaces,
for example: First Name, Last Name ... , But not work!
Just data of "id" column appear coz ...
- 386
0
votes
3
answers
584
views
i have 4 mat tab labels in a mat tab group and i want to position 2 of them left and another 2 label to right how to achive this one for angular 17
I require one and two mat tab labels to position on left side and three and four mat-tab-labels on right side of the page. I tried giving margin but the the element is expanding all the way to right ...
- 9
2
votes
1
answer
591
views
How to keep mat table paginator at selected page after refresh?
I am using mat table to show data and my API gives page-wise data.
Now, first time it renders and then user changes the page and refreshes the page after, then I want to show the second page and not ...
- 23
1
vote
0
answers
137
views
The data overflowing on sticky header in angular material table with cdk
We are using cdk-virtual-scroll-content with the angular material table. we have made the table header sticky. The issue we are seeing is the table data is overflowing above the sticky header. We ...
- 11
0
votes
1
answer
239
views
How to Synchronize mat-paginator Page Sizes?
I'm attempting to synchronize the page sizes of multiple mat-paginators that are nested across multiple child components.
I'm using a shared service to store the "global" page size.
However, ...
2
votes
1
answer
124
views
Mat-table get column width
How can I get column header width (angular mat-table) in typescript? I tried to use id and get elementById.clientWidth but it doesn't work for mat table column.
I need to get the size of each column ...
1
vote
1
answer
1k
views
Use one angular signal store for multiple features (components)
I've defined angular signal store in parent table component and update data using
patchState
export const TableStore = signalStore(
{ providedIn: 'root' },
withRouteParams({ id: param => ...
- 13
0
votes
1
answer
171
views
Angular Material Table with expandable rows opening one row is closing already opened row
I am using Angular Material Table with expandable rows to close and open for my "avroMsg" data column. My requirement is open row should not be closed if I click on to open another row. ...
- 23
1
vote
1
answer
111
views
Angular Material Table filtering of dynamic components
I often use components to display cell data in an Angular Material Table, including dynamic components created with ngComponentOutlet. When filtering those tables, I can't seem to properly filter ...
1
vote
0
answers
92
views
rowspan in angular material table based on condition
I am trying to convert a grid from web forms grid to angular material table.
I have a condition something like this in web forms grid:
protected void grdRequests_PreRender(object sender, EventArgs e)
...
1
vote
1
answer
150
views
Angular Mat Pagination and Mat Sort are not working
Mat Pagination (shows 0 of 0) and Mat Sort are not working. Can someone help? I tried other solutions available on the Stack Overflow but that does not seem to work for me.
Sample data from API:
{
...
- 79
2
votes
0
answers
128
views
How do I add an Angular v.17 Elements component to an ASP.Net webforms app?
I have an ASP.Net Webforms app running .Net 4.5.
I've built an Angular v.17 app with Angular Elements and an Angular Materials Table following this tutorial as a model of the Angular Elements portion: ...
- 111
1
vote
2
answers
676
views
How to pass data from parent to angular material table child component?
I am using angular material table with sorting https://stackblitz.com/run?file=src%2Fapp%2Ftable-sorting-example.ts
I plan to use it as a reusable component so that on the parent component, I just ...
- 399
1
vote
1
answer
324
views
How to get sorted data from mat-table of all pages?
I'm looking for a method to extract sorted data and save it under sortedData from dataSource of mat-table in order to save it to CSV file. There are filters and pagination applied to dataSource ...
- 41