tengo una tabla en Angular 10 con varia información en cada fila. Si presionas en la fila, te lanza a otra página donde se detalla con mas precision la información del elemento seleccionado. Al final de la fila, la última columna, es una columna que contiene dos botones para descargar la información en formato PDF o Docx.
Si presiono el botón se carga el microservicio que descarga el fichero seleccionado, pero al mismo tiempo también te abre el informe del elemento en la siguiente pagina. Como puedo hacer en Angular para localizar si he presionado un botón o si cierto botón o elemento activa el metodo .click(), o si hay alguna manera de aislar la escucha de los dos botones de descarga sin que se active la escucha implementada en cada fila de la tabla.
Estoy empezando con Angular en un proyecto nuevo y no tengo tanta experiencia para el manejo de elementos y escuchas dentro de esta tecnología. Si me pudieran orientar un poco.
Gracias.
componente.html
<table mat-table [dataSource]="data" matSort class="tabla tablaResumen" matTableExporter #exporter="matTableExporter" id="tablaDescargaPdf">
<!-- descarga fichero -->
<ng-container matColumnDef="descargaPdfDoc">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Descarga</th>
<td mat-cell *matCellDef="let row" class="u-text-align-center">
<div class="row">
<div class="col-6">
<button class="noButton" (click)="descargarPDF(row)"><i class="fas fa-file-pdf"></i></button>
</div>
<div class="col-6">
<button class="noButton" (click)="descargarDocx(row)"><i class="far fa-file-word"></i></button>
</div>
</div>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" (click)="mostrarExpediente(row)"
class="u-cursor"></tr>
</table>
componente.ts
mostrarExpediente(elemento) {
sessionStorage.setItem('idExp', JSON.stringify(elemento.idElemento));
sessionStorage.setItem('elementoStatus', JSON.stringify({'codigo': elemento.codigoEstadoElemento, 'descripcion': elemento.estadoElementoCorto}));
sessionStorage.setItem('elementoStatus', JSON.stringify(elemento.estadoInforme));
this.router.navigate(['/' + this.lang + '/backoffice/elemento']);
}