angular show hide code example
Example 1: hide and show in angular 8
<button (click)="toggleShow()" type="checkbox" >show/hide</button>
<div *ngIf="isShown" class="row container-fluid" id="divshow" >
Div Content
</div>
Example 2: hide and show in angular 8
isShown: boolean = false ; // hidden by default
toggleShow() {
this.isShown = ! this.isShown;
}
Example 3: angular.io hide
<div [style.visibility]="(numberOfUnreadAlerts == 0) ? 'hidden' : 'visible' ">
COUNTER: {{numberOfUnreadAlerts}}
</div>
Example 4: nghide angular 10
// Just bind to the hidden property
[hidden]="!myVar"
Example 5: hide and show in angular 8
/* Component */
isShown: boolean;
ngOnInit(){
isShown = false; //hidden every time subscribe detects change
}
toggleShow() {
this.isShown = ! this.isShown;
}
/* Template */
<div *ngIf="isShown" class="row container-fluid" id="divshow">
content
</div>