ngif expression resulting value won’t just be the boolean true or false
if the expression is just a object, it still evaluate it as truthiness.
if the object is undefined, or non-exist, then ngif will evaluate it as falseness.
common use is if an object loaded, exist, then display the content of this object, otherwise display "loading.......".
Still loading...........
object.info, object.id, object.name ... etc.
another example:
things = {
car: 'Honda',
shoes: 'Nike',
shirt: 'Tom Ford',
watch: 'Timex'
};
Nice car!
Call a Uber.
anthoer example:
Nice {{ car }}!
[ngif template][1]
[ngif angular 4][2]
[1]: https://blog.angular-university.io/angular-reactive-templates/
[2]: https://alligator.io/angular/ngif-new-features-angular4/
----------------------------------------------------------------------------------------------------------------
Here loading message will be shown unless dataFromServer has got some values
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
showSelected: boolean;
dataFromServer: string;
constructor() {
this.showSelected = true;
this.dataFromServer = 'Hello';
}
}
*ngIf="dataFromServer; else loadingBar">
{{dataFromServer}}
