Tengo una tabla de datos de material angular (tabla de entradas) que contiene todos los datos de las entradas. Hay un parámetro 'Estado' que contiene 'Abierto', 'En curso' y 'Cerrado'. En la columna Acción, hay 3 botones Ver más, Actualizar progreso y Seguimiento de ticket. Quiero ocultar el botón 'Actualizar progreso' si el Estado es igual a 'Cerrado'.

Aquí está el código para la tabla HTML que probé pero no funcionó.

 <!-- Status Column --> <ng-container matColumnDef="status"> <th mat-header-cell *matHeaderCellDef>Status</th> <td mat-cell *matCellDef="let element" id="status"> {{ element.status }} </td> </ng-container> <!-- Action Column --> <ng-container matColumnDef="action"> <th mat-header-cell *matHeaderCellDef>Action</th> <td mat-cell *matCellDef="let element"> <button mat-icon-button [matMenuTriggerFor]="menu"> <mat-icon>more_vert</mat-icon> </button> <mat-menu #menu="matMenu"> <button mat-menu-item (click)="openDialog(element)"> <mat-icon>assignment</mat-icon> <span>See More</span> </button> <div *ngIf="isShowDiv[element.id]"> <button mat-menu-item routerLink="updatestatus/{{ element.id }}"> <mat-icon>update</mat-icon> <span>Update Progress</span> </button> </div> <button mat-menu-item routerLink="trackticket/{{ element.id }}"> <mat-icon>drafts</mat-icon> <span>Track Ticket</span> </button> </mat-menu> </td> </ng-container>

Código mecanografiado:

 public isShowDiv: { [key: number]: boolean } = {}; ngOnInit(): void { // Get all data from formdata var obj = JSON.parse(localStorage.getItem('formdata')!); // Set data to dataSource this.dataSource = new MatTableDataSource(obj); // Looping through localStorage's data length for (var i = 0; i < obj.length; i++) { // Filtering the Update Progress button if status is closed console.log('Status', JSON.stringify(obj[i].status)); if (obj[i].status == 'Closed') { this.isShowDiv[obj[i].id] == true; } else { this.isShowDiv[obj[i].id] == false; } }