How to use Angular Promise using Typescript await and async (ES6)

Krishna KV
Team Leader, Aspire Systems
Published On :   24 Oct 2016
Visit Count
Today :  12    Total :   7841
Plan, Migrate, Secure, Report
SharePoint & Office 365 Tool. Simple & Easy to Use. 15-Day Trial!

Sharegate: Kick-Ass Tool
Think Your SharePoint & Office 365 Are Secure ? Find Out Now!

The typescript async and await is a ES6 functionality. It used to allow the developers to write the asynchronous code to flows as a synchronous method, without write a handler or a callback function. The similar pattern was used in C# to make use of the promises.


 class AppService {
     static $inject = ['$http'];
     constructor(private $http: ng.IHttpService) {
     public getBooks() {
         var url = "http://localhost/appservice/api/books";
         return this.$http({
             method: 'GET',
             url: url,
             headers: { "Accept": "application/json; odata=verbose" }


 class App {
     public static  app: ng.IModule
     constructor() {
        = angular.module('app', []);"homeCtrl", Home);'appService', AppService);
 new App();
 class Home {
     public lstBooks: Book[];
     static $inject = ['appService'];
     constructor(private appService: AppService) {
 public async getBooks() {
          await this.appService.getBooks().then(books =>{
              this.lstBooks = <Book[]>;


 <div ng-controller="homeCtrl as vm">
 	<div ng-show="">{{vm.process}}</div>
 		<tr ng-repeat="book in vm.lstBooks">
 	<button ng-click="vm.getBooks()" type="button">Click</button>
SharePoint Usage Reports
Usage reports, collaboration and audit for SharePoint.

Remote List Viewer