Skip to main content

Posts

Showing posts with the label Table with a sticky columns

Material Angular Table with sticky header,sticky column and Sticky Footer,Material Angular Table Part 3

Material Angular Table with sticky header, sticky column and Sticky Footer Part 3 Refer Mat-Table from material Angular io Table with sticky header By using position: sticky styling, the table's rows and columns can be fixed so that they do not leave the viewport even when scrolled. use sticky input to the matHeaderRowDef as below  <tr mat-header-row *matHeaderRowDef="customerdisplayedColumns; sticky: true"></tr> Table with sticky Footer use sticky input to the matFooterRowDef as below  <tr mat-footer-row *matFooterRowDef="customerdisplayedColumns; sticky: true"></tr> Table with a sticky columns use sticky input to the matColumnDef as below  <ng-container matColumnDef="name" sticky >
    <th mat-header-cell *matHeaderCellDef mat-sort-header >Name</th>
    <td mat-cell *matCellDef="let element"> {{element.name}}       </td>
    <td mat-footer-cell *matFooterCellDef> Count </td>…