mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-12-22 19:07:07 +00:00
Updated Angular Material element examples
This commit is contained in:
@@ -0,0 +1,49 @@
|
||||
<div class="example-container mat-elevation-z8">
|
||||
<mat-table #table [dataSource]="dataSource">
|
||||
|
||||
<!-- Checkbox Column -->
|
||||
<ng-container matColumnDef="select">
|
||||
<mat-header-cell *matHeaderCellDef>
|
||||
<mat-checkbox (change)="$event ? masterToggle() : null"
|
||||
[checked]="selection.hasValue() && isAllSelected()"
|
||||
[indeterminate]="selection.hasValue() && !isAllSelected()">
|
||||
</mat-checkbox>
|
||||
</mat-header-cell>
|
||||
<mat-cell *matCellDef="let row">
|
||||
<mat-checkbox (click)="$event.stopPropagation()"
|
||||
(change)="$event ? selection.toggle(row) : null"
|
||||
[checked]="selection.isSelected(row)">
|
||||
</mat-checkbox>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Position Column -->
|
||||
<ng-container matColumnDef="position">
|
||||
<mat-header-cell *matHeaderCellDef> No. </mat-header-cell>
|
||||
<mat-cell *matCellDef="let element"> {{element.position}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef> Name </mat-header-cell>
|
||||
<mat-cell *matCellDef="let element"> {{element.name}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Weight Column -->
|
||||
<ng-container matColumnDef="weight">
|
||||
<mat-header-cell *matHeaderCellDef> Weight </mat-header-cell>
|
||||
<mat-cell *matCellDef="let element"> {{element.weight}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Symbol Column -->
|
||||
<ng-container matColumnDef="symbol">
|
||||
<mat-header-cell *matHeaderCellDef> Symbol </mat-header-cell>
|
||||
<mat-cell *matCellDef="let element"> {{element.symbol}} </mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
||||
<mat-row *matRowDef="let row; columns: displayedColumns;"
|
||||
(click)="selection.toggle(row)">
|
||||
</mat-row>
|
||||
</mat-table>
|
||||
</div>
|
||||
Reference in New Issue
Block a user