typescriptでhtmlの要素を動的に表示・非表示

[hidden] だの ng-show だの色々出てきますし、changeDetectorRef とかで再描画のトリガーをかけてあげなければいけないのかしらと散々悩みましたが。

<div fxFlex="15%" fxLayoutAlign="center end" *ngIf="this.showLiveButton">
  <button mat-fab aria-label="livestreaming" (click)="this.navigateToLive()">
    <mat-icon>live_icon</mat-icon>
  </button>
</div>

export class HomeComponent implements OnInit {
 ... (snip) ...
  showLiveButton = false;
 ... (snip) ...

this.showLiveButton = someBooleanExpression();

こんだけでしたわ。