Преобразование асинхронного кода в синхронный в Angular 6 - ограничение типа возвращаемого значения с помощью Async / Await - PullRequest
Новая
       78

Преобразование асинхронного кода в синхронный в Angular 6 - ограничение типа возвращаемого значения с помощью Async / Await

0 голосов
/ 04 октября 2018

Я писал службу, которая помогала бы извлекать данные из URL, преобразовывать их в массив типа returnType и передавать их любому компоненту, в который он был вставлен:

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».

Почему Angular ограничивает функции async для возврата объектов, подобных Promise (которые по своей сути асинхронны), когда вся точка async-await шаблон заключается в том, чтобы асинхронный код вел себя синхронно?

У меня такое чувство, что есть веская причина, но я здесь упускаю суть.

...