有条件的 Angular Promise答案

【问题标题】：Angular Promise with condition有条件的 Angular Promise
【发布时间】：2019-06-10 22:35:09
【问题描述】：

如果我的变量中已经有值，我不想到达端点 (getUserInfo)，我编写了如下代码，但是有重复的代码，想看看是否有人有更好的编写方法：

let report;
if (this.userInfo) {
   report = {
    ReportType: reportType,
    ReportID: id,
    ReportFormat: format,
    ReportName: `${reportType}_${id}`,
    Filters: shouldNotParseFilters ? filterContent : [],
    ViewFields: columns || [],
    OrgName: this.userInfo[0].orgname,
    FullName: this.userInfo[0].fullname
  } as SavedReport;
  if (!shouldNotParseFilters) this.reportFilterService.mapReportFilters(<ReportFilterContext>filterContent, report);
  report.Filters.push({ 'maxitems': [-1] });
  this.nrcService.downloadReport(report, fileName).subscribe({ error: err => this.nrcService.handleError(err) });
}
else {
  this.nrcService.getUserInfo().then(data => {
    this.userInfo = data;
     report = {
      ReportType: reportType,
      ReportID: id,
      ReportFormat: format,
      ReportName: `${reportType}_${id}`,
      Filters: shouldNotParseFilters ? filterContent : [],
      ViewFields: columns || [],
      OrgName: data[0].orgname,
      FullName: data[0].fullname
    } as SavedReport;
    if (!shouldNotParseFilters) this.reportFilterService.mapReportFilters(<ReportFilterContext>filterContent, report);
    report.Filters.push({ 'maxitems': [-1] });
    this.nrcService.downloadReport(report, fileName).subscribe({ error: err => this.nrcService.handleError(err) });
  })
 }

【问题讨论】：

在 if/else 的主体中，简单地创建一个 promise，然后在条件之后调用 .then，从而消除重复。
我只是在学习angular，不明白你的意思，你能解释一下吗？

标签： angular promise es6-promise

【解决方案1】：

你可以使用 async/await 之类的

this.userInfo = await this.userInfo || this.nrcService.getUserInfo();
report = { ... }

【讨论】：

感谢您的回答，我不确定谁在投票，但我刚刚投票支持您，也有人对我这样做，不确定因为我对 JS 太熟悉，而不是公平。

【解决方案2】：

在这种情况下，我建议使用async/await 来解决您的需求：

// Add `async` here 
async your_function_name () {
    ...
    let report;
    if (!this.userInfo) {
        // Waits until your user info is loaded
        this.userInfo = await this.nrcService.getUserInfo();
    }
    report = {
        ReportType: reportType,
        ReportID: id,
        ReportFormat: format,
        ReportName: `${reportType}_${id}`,
        Filters: shouldNotParseFilters ? filterContent : [],
        ViewFields: columns || [],
        OrgName: this.userInfo[0].orgname,
        FullName: this.userInfo[0].fullname
    } as SavedReport;

    if (!shouldNotParseFilters) {
        this.reportFilterService.mapReportFilters(<ReportFilterContext>filterContent, report);
    }

    report.Filters.push({ 'maxitems': [-1] });
    this.nrcService.downloadReport(report, fileName).subscribe({ error: err => this.nrcService.handleError(err) });

}

如果您不熟悉async/await，请参阅here ;-)

另一种选择是使用不带async/await 的 Promises，但看起来不太好：

let report;
// Create a new promise, which resolves directly
let promise = new Promise(r => r());
if (!this.userInfo) {
    // Assigns the loading promise to the promise variable
     promise = this.nrcService.getUserInfo().then(data => {
        this.userInfo = data;
    });
}
// Waits until the promise is resolved
promise.then(() => {
    report = {
        ReportType: reportType,
        ReportID: id,
        ReportFormat: format,
        ReportName: `${reportType}_${id}`,
        Filters: shouldNotParseFilters ? filterContent : [],
        ViewFields: columns || [],
        OrgName: this.userInfo[0].orgname,
        FullName: this.userInfo[0].fullname
    } as SavedReport;

    if (!shouldNotParseFilters) {
        this.reportFilterService.mapReportFilters(<ReportFilterContext>filterContent, report);
    }

    report.Filters.push({ 'maxitems': [-1] });
    this.nrcService.downloadReport(report, fileName).subscribe({ error: err => this.nrcService.handleError(err) });

});

【讨论】：

感谢您的解释，它奏效了，顺便说一句，我不会反对这些答案。

【解决方案3】：

试试这个

async method() {
    const userInfo = await this.nrcService.getUserInfo();
    if (!!userInfo) {
        this.userInfo = userInfo;
    }
    if (!!this.userInfo) {
        report = {
            ReportType: reportType,
            ReportID: id,
            ReportFormat: format,
            ReportName: `${reportType}_${id}`,
            Filters: shouldNotParseFilters ? filterContent : [],
            ViewFields: columns || [],
            OrgName: this.userInfo[0].orgname,
            FullName: this.userInfo[0].fullname
        } as SavedReport;

        if (!shouldNotParseFilters) {
            this.reportFilterService.mapReportFilters(<ReportFilterContext>filterContent, report);
        }

        report.Filters.push({ 'maxitems': [-1] });
        this.nrcService.downloadReport(report, fileName).subscribe({ error: err => this.nrcService.handleError(err) });
    } else {
        // ...
    }
}

【讨论】：