*ngIf
directive also supports else
statement.
<div *ngIf="isLoading; else notLoading">loading...</div>
<ng-template #notLoading>not loading</ng-template>
file:app.component.ts
import { Component, HostBinding } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<div *ngIf="isLoading; else notLoading">loading...</div>
<ng-template #notLoading>not loading</ng-template>
`,
},
)
export class AppComponent {
isLoading = false
}
file:app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { FormsModule } from '@angular/forms';
@NgModule({
imports: [BrowserModule, FormsModule],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule {}