ngIf Data Binding

ngif-data-binding.ts

import {Observable} from 'rxjs/Observable';
import {defer} from 'rxjs/observable/defer';
import {of} from 'rxjs/observable/of';

@Component({
  selector: 'my-app',
  template: `
    <ng-container *ngIf="data$ | async as data"> <!-- single subscription -->
      <div>
        Data: {{data}} <!-- 0.4431839407652687 -->
      </div>
      <div>
        Data: {{data}} <!-- 0.4431839407652687 -->
      </div>
    </ng-container>
  `,
})
export class App {
  data$: Observable<number> = defer(() => of(Math.random()));
}