File tree Expand file tree Collapse file tree 2 files changed +12
-2
lines changed
src/material-examples/table-selection Expand file tree Collapse file tree 2 files changed +12
-2
lines changed Original file line number Diff line number Diff line change 5
5
< th mat-header-cell *matHeaderCellDef >
6
6
< mat-checkbox (change) ="$event ? masterToggle() : null "
7
7
[checked] ="selection.hasValue() && isAllSelected() "
8
- [indeterminate] ="selection.hasValue() && !isAllSelected() ">
8
+ [indeterminate] ="selection.hasValue() && !isAllSelected() "
9
+ [aria-label] ="checkboxLabel() ">
9
10
</ mat-checkbox >
10
11
</ th >
11
12
< td mat-cell *matCellDef ="let row ">
12
13
< mat-checkbox (click) ="$event.stopPropagation() "
13
14
(change) ="$event ? selection.toggle(row) : null "
14
- [checked] ="selection.isSelected(row) ">
15
+ [checked] ="selection.isSelected(row) "
16
+ [aria-label] ="checkboxLabel(row) ">
15
17
</ mat-checkbox >
16
18
</ td >
17
19
</ ng-container >
Original file line number Diff line number Diff line change @@ -48,4 +48,12 @@ export class TableSelectionExample {
48
48
this . selection . clear ( ) :
49
49
this . dataSource . data . forEach ( row => this . selection . select ( row ) ) ;
50
50
}
51
+
52
+ /** The label for the checkbox on the passed row */
53
+ checkboxLabel ( row ?: PeriodicElement ) : string {
54
+ if ( ! row ) {
55
+ return `${ this . isAllSelected ( ) ? 'select' : 'deselect' } all` ;
56
+ }
57
+ return `${ this . selection . isSelected ( row ) ? 'deselect' : 'select' } row ${ row . position + 1 } ` ;
58
+ }
51
59
}
You can’t perform that action at this time.
0 commit comments