Angular 7 Structural Directive - *ngif - Two Ways of Using
app.component.ts
true vs !true
app.component.html
<button class="btn btn-primary" (click)="onSaving()">Save</button>
<h3 *ngIf="displaystatus">{{ firstname }} {{ lastname }}</h3>
<h3 *ngIf="!displaystatus">Enter something</h3>
*ngif else
app.component.html
<h3 *ngIf="!displaystatus; else nodisplay">Enter something</h3>
<ng-template #nodisplay>
<h3>{{ firstname }} {{ lastname }}</h3>
</ng-template>
onSaving() {
this.displaystatus = true;
}
Comments
Post a Comment