Question

我正在编写一项服务，该服务将帮助从URL提取数据，将其转换为returnType类型的数组，并将其传递给它注入到的任何Component：

InjectableService （fetchJSON()返回Observable<JSON>）：

@Injectable(
  ...
)
export class InjectableService {
  dataToReturn: returnType[] = [];
  const url: string = "https://some.url/some.queries";

  constructor(private transactionService: TransactionService) {} //for encapsulating HTTP calls

  public getData(): returnType[] {
    this.transactionService.fetchJSON(this.url).subscribe(
      result => {
        this.functionToMassageResultIntoReturnTypeArray(result);
      }
    );

    return this.dataToReturn;
  }

  private functionToMassageResultIntoReturnypeArray(result: any) {
    //some logic...
    this.dataToReturn.push(//some data...);
  }
}

ParentComponent （对this.data所做的任何更改都会反映在模板中）：

@Component(
  ...
)
export class ParentComponent implements OnInit, OnChanges{
  data: returnType[]= [];

  constructor(private dataService: InjectableService) {}

  ngOnInit {
    this.data = this.dataService.getData();
  }

  ngOnChanges {
    this.data = this.dataService.getData();
  }
}

很显然，这失败了，因为InjectableService.getData()中的订阅在函数返回数据之前无法解析。因此，基本上，我需要一种方法来确保InjectableService（subscribe()函数）中的异步代码以同步方式执行。

令人惊讶的是，在Angular 6中似乎没有简单的方法可以做到这一点。我能找到的最接近的是async-await模式：

public async getData(): returnType[] {
  await this.transactionService.fetchJSON(this.url).subscribe(
    result => {
      this.functionToMassageResultIntoReturnTypeArray(result);
    }
  );

  return this.dataToReturn;
}

但是这个没有编译-它抱怨函数的返回值；显然，它只能返回“与Promise兼容的构造函数值”。

当async模式的全部目的是使异步代码同步运行时，为什么Angular约束async-await函数返回类似Promise的对象（本质上是异步的）？

我觉得这背后有充分的理由，但是我在这里没讲到重点。

在Angular 6中将异步代码转换为同步代码-使用Async / Await的返回类型约束

0 个答案: