bug(table): header does not update after context change

[TobiDimmel]

Reproduction

https://stackblitz.com/edit/mat-table-column-width-issue

Maybe related to #13030

Expected Behavior

In my use case I want to display mat-table with column widths that are defined through some configuration object (context).
That configuration object can change during the component life time (in my production case through route component reuse).

I expect that mat-table gets updated when the configuration object changes.

Actual Behavior

mat-table does not get updated.
If you call this.matTable.removeHeaderRowDef(null) manually on change mat-table is updated correctly.

Environment

• Angular: 11.2.1
• CDK/Material: 11.2.1
• Browser(s): Chrome, Safari, ...
• Operating System (e.g. Windows, macOS, Ubuntu): Windows 10, iOS, ...

[crisbeto]

This seems like some sort of change detection issue. I've tweaked an example a bit to print out the intended width in each of the headers and outside the table. Note how the numbers in the table stay the same, whereas the ones under the table update as expected. https://stackblitz.com/edit/mat-table-column-width-issue-nrw3yf?file=src%2Fapp%2Ftable%2Ftable.component.ts