Angular string interpolation options to sync to a dynamically updated hidden input field's value

I have an angular template below where I'm trying to bind a span to the value of a hidden input field.

The input field is bound to the value of a mat-autocomplete which is in the same row of a dynamically generated HTML table. The input accurately reflects the value from the mat-autocomplete in real time. I've verified this works as expected. The issue is that the span never updates to reflect that value.

Here is the HTML template where I am trying to get data[column] written as the synced "value" from the hidden input field:

<ng-container *ngFor="let column of tableConfig?.columns; index as i;" matColumnDef="{{column}}">
    <ng-container>
      <th mat-header-cell
        mat-sort-header
        *matHeaderCellDef>
        <ng-container *ngIf="![SELECTION_COLUMN_NAME, ACTIONS_COLUMN_NAME].includes(column)">
          {{ [column]  }}
        </ng-container>
      </th>
      <td mat-cell
        *matCellDef="let data; let rowIndex = index">
        <span>{{ data[column] }}</span>
      </td>

The issue I have is that data[column] is apparently not properly synced with the hidden input. Because the hidden input's value IS synced and updated each time the mat-autocomplete's value changes, but data[column] does not update.

Is there a workaround to get the value of the hidden input? You can see it below from the document when viewed in the browser:

<input type="hidden" value="Write This in the TD Cell!"  name="testHidden">