Q: Angular Conditional Atribute inside template How can I give an HTML tag a conditional attribute which toggles depending on the state of a variable declared in the component file?
I tried to give it a go unsuccessfully:
 <th mat-header-cell *matHeaderCellDef {{new ? 'mat-sort-header' : ''}}   >

In this case using *ngIf or ng-template is not appropriate due to the *matHeaderCellDef reference.
Thank you.

A: You might try following methods to do it-
By Applying *ngIf directive
<th mat-header-cell *matHeaderCellDef *ngIf="!new" >
<th mat-header-cell *matHeaderCellDef mat-sort-header *ngIf="new" >

By using attribute binding-
<th mat-header-cell *matHeaderCellDef [attr.mat-sort-header]="new?'': null" >

Make sure "new" which I have taken from your example code is variable which stores the value of expression to decide whether it has to use mat-sort-header attribute or not.
One more tip you can't use new as variable name as its reserved keyword in javascript.
