how to hide/show html tag in type script in Angular component

Question

I have created a form in angular Html component, which is used to add users and update them using dialog module. If the user clicks for updating, I want to hide password input in HTML.

    <mat-form-field appearance="outline">
        <mat-label>Password</mat-label>
        <input formControlName="password" matInput/>  
    </mat-form-field> 

Answer 1

component.html

<ng-container *ngIf='!isUpdating'>
    <mat-form-field appearance="outline">
        <mat-label>Mot de passe</mat-label>
        <input formControlName="password" matInput/>  
    </mat-form-field>
</ng-container>

component.ts

export class Component {
    isUpdating = false;

    onUpdate() {
        this.isUpdating = true;
    }
}

You can add condition on Password Input Whenever isUpdating will set to true then password input will removed from DOM and If isUpdating will set to false then Password input will add in DOM automatically.