Action button not working on Angular Material Expandable table row - angular-material-table

Question

Here I'm trying to working an action button (Edit) in angular material expandable table each row. When I click edit button it's not work but row is become expanded.
ISSUE:-
When click Edit button should be work on click and row should not be expanded.
When click on row's other part without Edit button then only row will be expanded.
Here is my code:
viewuser.component.html
<table mat-table [dataSource]="tableData" multiTemplateDataRows class="mat-elevation-z8"><ng-container matColumnDef="Name">
<th mat-header-cell *matHeaderCellDef>Name </th>
<td mat-cell *matCellDef="let element">{{ element.f_name }} {{ element.l_name}} </td></ng-container><ng-container matColumnDef="Designation">
<th mat-header-cell *matHeaderCellDef>Designation </th>
<td mat-cell *matCellDef="let element"> {{ element.title }}</td></ng-container><ng-container matColumnDef="Department">
<th mat-header-cell *matHeaderCellDef>Department </th>
<td mat-cell *matCellDef="let element"> {{element.dept_name}}</td></ng-container><ng-container matColumnDef="Edit">
<th mat-header-cell *matHeaderCellDef> Edit</th>
<td mat-cell *matCellDef="let element"><button mat-icon-button><mat-icon color="primary">border_color</mat-icon></button> </td></ng-container><ng-container matColumnDef="expandedDetail"><td mat-cell *matCellDef="let element" [attr.colspan]="columnsToDisplay"><div class="example-element-detail" [#detailExpand]="element == expandedElement ? 'expanded' : 'collapsed'"><!--expanded content goes here --></div></td></ng-container><tr mat-header-row *matHeaderRowDef="columnsToDisplay"></tr><tr mat-row *matRowDef="let element; columns: columnsToDisplay;"class="example-element-row" [class.example-expanded-row]="expandedElement === element"(click)="expandedElement = expandedElement === element ? null : element"></tr><tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="example-detail-row"></tr></table>
viewuser.component.ts
columnsToDisplay: string[] = ['Name','Designation','Department','Edit'];
Here is angular material reference .. https://stackblitz.com/angular/ygdrrokyvkv?file=app%2Ftable-expandable-rows-example.html