Typescript 2.1 с асинхронным/ожидающим созданием целевой ES5/ES3 для angularjs

Я пытаюсь использовать async/await в проекте angular 1.5.5.

Учитывая этот метод обслуживания

    getDocumentTypes(): angular.IPromise<DocumentType[]> {
        var url = "api/document/types";
        this.$log.log(url);
        return this.$http.get(url).then(_ => _.data);
    }

Я пытаюсь создать версию метода async / await.

    async getDocTypes(): angular.IPromise<DocumentType[]> {
                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    }}

Intellisense показывает ошибку: TS1055 Тип 'angular.IPromise' не является допустимым типом возврата функции async в ES5/ES3, потому что он не относится к Promise- совместимое.

Есть ли правильный способ использования angular обещания в typescript 2.1 с async/await?

Ответы

Ответ 1

async/await может работать в angularjs 1.5

если планировщик $q изменен с помощью Bluebird promises.
Добавив следующее к app.ts

export class Module {
    app: ng.IModule;

    constructor(name: string, modules: Array<string>) {
        this.app = module(name, modules);
    }
}

function trackDigests(app) {
    app.run(["$rootScope",$rootScope => {
        Promise.setScheduler(cb => {
            $rootScope.$evalAsync(cb);
        });
    }]);
}

export var app: ng.IModule = new Module("app", []).app;
trackDigests(app);

Регулярный планировщик $q заменяется. Код вроде этого работает из коробки!

async $onInit() {
    this.start();
    try {
        var key = await this.powerService.getKey(this._apiKey.partyAccountNumber);
        var sites = await this.powerService.loadSites(this._apiKey.partyAccountNumber);
        await this.showSummary(sites);
        this.stop(true);
    } catch (error) {
        this.$log.error(error);
        this.stop(false);
    }
}

Вы можете вернуть Promise или ng.IPromse из своих методов обслуживания, поскольку они взаимозаменяемы.

export interface IPowerService {
    setKey(key: pa.PowerApi): ng.IPromise<dm.ClientSite[]>;
    getKey(partyAccountNumber: string): Promise<pa.PowerApi>;
}

Используя вышеприведенный trackDigests в тестовой жгуте, модульные тесты также будут работать с async / await В моем случае я добавил следующее в свой webpack.test.js, чтобы включить async/await, чтобы работать аналогично с тестами карма.

plugins: [
    new webpack.ProvidePlugin({
        Promise: 'bluebird'
    })
],

Ответ 2

Вам может потребоваться просто использовать Promise напрямую:

async getDocTypes(): Promise<DocumentType[]> {

}}

Сгенерированный код typescript 2+ будет выходить за пределы цикла angular, а директива component/не будет корректно обновлять представление/модель.

Ответ 3

Отказ от ответственности: этот ответ работает в 2018 году с TS 3.2.2. Я не уверен, что они похожи в 2.1.

в настоящее время есть опции компилятора, позволяющие добавлять библиотеки к компиляции. Для использования async/await у вас есть следующие опции:

  • командная строка: --target ES6 --lib es2015.generator.
  • Файл конфигурации: 
    
{
    "compilerOptions": {
        "target": "es5",
        "lib": ["es2015.generator"]
        ...
   }
   ...
}