“IPromise<any>”无法赋值给类型“Promise<any>”。

Question

我正在构建一个确认对话框，用于在用户更改选项卡时进行提示。代码本身没有问题，但是tslint 报告了类型不匹配的错误。控制器如下：

export class MyController implements ng.IController {

    constructor(private $transitions: TransitionService,
                private $translate: angular.translate.ITranslateService) {
        'ngInject';

        $transitions.onStart({}, () =>
            this.alert
                .showConfirm(
                    this.$translate.instant('dialogs.confirmLeave.content'),
                    this.$translate.instant('dialogs.confirmLeave.title')
                )
                .then(() => true)
                .catch(() => false)
        );
    }

    ...
}

this.alert.showConfirm 最终从 angular-ui-bootstrap 调用了 this.$uibModal.open()。这会产生以下警告：

error TS2345: Argument of type '() => IPromise<boolean>' is not assignable to parameter of type 'TransitionHookFn'.
  Type 'IPromise<boolean>' is not assignable to type 'boolean | void | TargetState | Promise<boolean | void | TargetState>'.
    Type 'IPromise<boolean>' is not assignable to type 'Promise<boolean | void | TargetState>'.
      Types of property 'then' are incompatible.
        Type '{ <TResult>(successCallback: (promiseValue: boolean) => TResult | IPromise<TResult>, errorCallbac...' is not assignable to type '<TResult1 = boolean | void | TargetState, TResult2 = never>(onfulfilled?: (value: boolean | void ...'.
          Type 'IPromise<any>' is not assignable to type 'Promise<any>'.
            Types of property 'then' are incompatible.
              Type '{ <TResult>(successCallback: (promiseValue: any) => TResult | IPromise<TResult>, errorCallback?: ...' is not assignable to type '<TResult1 = any, TResult2 = never>(onfulfilled?: (value: any) => TResult1 | PromiseLike<TResult1>...'.
                Type 'IPromise<any>' is not assignable to type 'Promise<any>'.

有没有任何想法来解决这个问题？

- Andrei Roba

Answer 1

看起来无论 this.alert.showConfirm() 是什么，它都没有返回真正的 Promise。尝试将结果包装在一个 Promise 中：

export class MyController implements ng.IController {

    constructor(private $transitions: TransitionService,
                private $translate: angular.translate.ITranslateService) {
        'ngInject';

        $transitions.onStart({}, () =>
            Promise.resolve(
                this.alert
                    .showConfirm(
                        this.$translate.instant('einsteinsst.dialogs.confirmLeave.content'),
                        this.$translate.instant('einsteinsst.dialogs.confirmLeave.title')
                    )
            )
            .then(() => true)
            .catch(() => false)
        );
    }

    ...
}

Promise.resolve() 会将任何可 thenable 对象（即任何实现 IPromise 的对象）转换为真正的 Promise，但是 IPromise 接口与 Promise 不直接兼容。

有关详细信息，请参见文档。

- Duncan

---

谢谢你的见解，它起作用了。另一种更冗长的方法是使用以下形式替换Promise.resolve：return new Promise((resolve, reject) => { //一些逻辑; 返回resolve（value）})。 - JP Lew