'Why mat table not detecting chage

I am working on mat table, for one of cell,

<!-- Bid Column -->
<ng-container matColumnDef="bid">
  <th mat-header-cell *matHeaderCellDef> BID </th>
  <div *ngIf="editMode">
    <td mat-cell *matCellDef="let testTenor" [ngClass]="{'xx': testTenor.bid.hasInterest }"> <input value="{{testTenor.bid.value}}"> </td>
  </div>
  <div *ngIf="!editMode">
    <td mat-cell *matCellDef="let testTenor" [ngClass]="{'xx': testTenor.bid.hasInterest }"> {{testTenor.bid.value}} </td>
  </div>
</ng-container>

Edit mode is boolean, I am toggling it with edit button. I am triying to see cell in edit mode when edit mode is true. And i am changing this value from button in another component:

this.toggleEditModeOnBidEventSubscription = this.controlPanelService.getToggleEditModeOnBidEvent().subscribe(() => {
      if (this.selectedRow) {
        this.selectedRow.bid.isEditable = !this.selectedRow.bid.isEditable;
        this.editMode = this.selectedRow.bid.isEditable;
      }

Can someone tell please if there is an easier-smarter way to fix this? Many thanks



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source