Ошибка в StackBlitz: «Неожиданное зарезервированное слово строгого режима» при попытке использовать async / await с subscription.toPromise () - PullRequest
1 голос
/ 21 января 2020

У меня есть часть Angular веб-приложения, настроенного на StackBlitz здесь .

В нем я экспериментирую с лучшим способом реализации таблицы соответствия с данными, поступающими из базы данных, с функциями фильтрации, разбивки на страницы и сортировки.

В итоге мы написали реализацию класса интерфейс MatTableDataSource называется VideoDataSource в ./videoDataSource.model.ts. В нем есть метод с именем loadMatches(). Это async метод:

async loadMatches(): Promise<any>{
    console.log("loadMatches entered");
    let results = await this.dbService.getMatchesV2().toPromise();
    console.log("results in loadMatches");
    console.log(results);
    let dbMatches = results.map(Match.fromJson);
    return dbMatches.toPromise();
  }

, где dbService.getMatchesV2(), в свою очередь, приходит из внедренного сервиса и выглядит так:

getMatchesV2(){
    return this.db.list<Match>('/matches').valueChanges();
  }

, где db - это параметр базы данных служба типа AngularFireDatabase.

Вызов loadMatches() в app.component.ts выглядит следующим образом:

this.data = await this.dataSource.loadMatches();

, где data является параметром AppComponent типа Match[].

Я получаю сообщение об ошибке «Неожиданное зарезервированное слово строгого режима» со ссылками на номера строк, которые не имеют никакого смысла (в app.module.ts; я думаю, что это пост -компилировать номер строки?). Проблема началась сразу после того, как я попытался реализовать async / await. DatabaseService в основном работает с Observables, но я решил, что .toPromise() будет достаточно для решения проблемы. Любое понимание того, что происходит? Большое спасибо заранее!

1 Ответ

4 голосов
/ 25 января 2020

Что происходит?

Ошибка зарезервированного ключевого слова вызвана одной из ваших внутренних зависимостей.

Где именно?

В app.component.ts у вас есть эта строка -

this.data = await this.dataSource.loadMatches();

Что за исправление?

async ngOnInit() {

Почему?!

Поскольку вы используете await, ваша функция, внутри которой используется ожидание, должна быть помечена как async. Выражение await разрешено только внутри функции asyn c. В вашем случае это ngOnInit. (Не забудьте сделать это и в других местах). Вы можете прочитать больше в Замечаниях по выпуску Typescript 1.7

Как вообще отладить эти проблемы?

Это один из тех случаев, когда проблема не в том, что вы на самом деле ищете. Таким образом, может помочь общая проверка ошибок линтера (все приветствия!) И попытка в разных браузерах. Вы можете получить разные ошибки и проследить стек в разных браузерах.

Хорошо! Хорошо! Но ошибка исчезает? Это работает?

Вот вам go - https://stackblitz.com/edit/angular-tmgbw7?file=src%2Fapp%2Fapp.component.ts

...