const heroes: Hero[] = [ { name: 'Peter', level: 25 }, { name: 'Tony', level: 50 }, { name: 'Stephen', level: 99 } ]; getHeroes() { return of(heroes); // httpClient on Angular or from (rxjs/operators) for Promise } 

 readonly request = new Action<Hero[]>(); getHeroes() { this.request.exec( this.appService.getHeroes(), // Observable (response: Hero[]) => console.log('success', response), (error: Error) => console.log('error', error) ); } 

 <ng-container *ngIf="request.$ | async as data"> <span *ngIf="data.loading">Loading...</span> <span *ngIf="data.error">Error! {{ data.error }}</span> ... <tr *ngFor="let row of data.payload"> <td>{{ row.name }}</td> <td>{{ row.level }}</td> </tr> ... </ng-container> ``