I want to use the angular material mat-table with clickable rows and also a button column with Firefox Browser.
When i first added the button the event was not triggered (just the event of the row).
I read some threads about that issue: Angular Material 2 Table Mat Row Click event also called with button click in Mat Cell
Angular Material table row (click) event triggered when clicking an action in a cell within that row
I got it working with event.stopPropagation
on the Chrome Browser but not on Firefox 63.0.3 (64-Bit). No Event is triggered at all in Firefox.
<mat-table [dataSource]="dataSource" matSort>
.
.
.
<ng-container *ngIf="roles.approver" matColumnDef="approve">
<mat-header-cell *matHeaderCellDef mat-sort-header>Approve</mat-header-cell>
<mat-cell *matCellDef="let element" (click)="$event.stopPropagation()">
<button mat-icon-button type="button">
<mat-icon color="primary" (click)="approve(element.receipt_id, 2)">check_circle</mat-icon>
</button>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;" (click)="onDetail(row.receipt_id)"></mat-row>
</mat-table>
Anyone got it working with Firefox?