Angular / Typescript 承诺答案

【问题标题】：Angular / Typescript PromisesAngular / Typescript 承诺
【发布时间】：2021-08-25 10:17:00
【问题描述】：

我已经被 Promise 缠住了。我想等到 checkNewVersion() 完成，然后执行 then 语句，但此刻，'finished' 被首先调用，然后是 'api response'

page.ts

public ionViewDidLoad() {
    this.platform.ready()
        .then(() => {
            this.versionChecker.checkNewVersion()
                .then(response => {
                    console.log('finished')
                })
        });
}

版本检查器.ts

public checkNewVersion(force?: boolean): Promise<CheckResult> {
let platform = this.platform.is("ios") ? 'ios' : 'android';
if (force || this.shouldCheck()) {
    return  this.checkPromise = this.api.post('check-version', {platform: platform, version: '0.2.1'})
  .then(response => {
      console.log('api response')
      let result = {
          latest: response.latest,
      }
    return result;
  });
}
return this.checkPromise;
}

api-service.ts

public post(path: string, body: any): Promise<any> {
    //add location if we have it.
    let postBody = {...body};
    postBody.locationInfo = this.locationService.getUpdatedLocation();

    return this.http.post(this.settings.api + path, postBody, { headers: this.headers })
        .map((res: Response) => { return res.json(); })
        .catch((err: Response, obs: Observable<any>) => {
            return this.handleError(err, obs);
        })
        .toPromise();
}

【问题讨论】：

标签： javascript angular typescript es6-promise

【解决方案1】：

修改version-checker.ts如下：

public checkNewVersion(force?: boolean): Promise<CheckResult> {
  const platform = this.platform.is("ios") ? 'ios' : 'android';
  return new Promise((resolve, reject)=>{
    if (force || this.shouldCheck()) {
      this.api.post('check-version', {platform: platform, version: '0.2.1'})
        .then(response => {
          console.log('api response')
          resolve({
              latest: response.latest,
          });
     });
    }else{
       reject("your error...");
    }
 });
}

【讨论】：

【解决方案2】：

你可以在函数开头使用async，在调用promise时使用await：

示例

async ionViewDidLoad() {
    await this.versionChecker.checkNewVersion()
        .then(response => {
              console.log('finished')
        });

    this.platform.ready()
        .then(() => {

        });
}

【讨论】：

谢谢，我已经更新了代码。你能更新你的答案吗？
需要注意的是，使用await 与常规使用promise 略有不同，因为代码执行回到同步行为：代码在@987654326 时不会走得更远@ 未完待续。使用这些简单的操作应该不会产生影响，但对于更复杂的代码可能会产生影响。
@Kaddath 根据定义，异步函数总是返回一个承诺。只有 async / await 语法可以作为同步代码读取，但调用本身将继续是异步的。只有 await 在异步函数内部阻塞。为了优化这一点，在等待多个承诺时应该小心，为此有一些帮助函数，例如const results = await Promise.all(promises)。