handle-api-call-state-nicely

component.ts

@Component({
  selector: 'app-news',
  template: `
  <button (click)="load()">Load News</button>
   <!--loading spinner-->
  <p *ngIf="(news$ | async).loading">loading...</p>
  
  <p *ngFor="let item of (news$ | async).entities">{{item}}</p>
  `
})
export class NewsComponent {
   news$: Observable<News>;
   constructor(private store: Store<{news: News}>) {
    this.news$ = this.store.select(state => state.news);
  }
   load() {
    this.store.dispatch(new LoadNews());
  }
}