Асинхронные вызовы в угловых, обещаниях или наблюдаемых - PullRequest
0 голосов
/ 26 ноября 2018

Я понимаю, что это очень распространенная тема, но я застрял и не могу понять все решение.

У меня есть приложение Angular 6, которое вызывает API в Java Spring для запросабаза данных.

Моя проблема, например, на одной странице я должен запросить базу данных несколько раз в компоненте.

nbOnInit () выполняет getGames (), getTasks () и getGlobalProgress ().

Первая проблема заключается в том, что getGames () запаздывает, и в консоли Chrome у меня есть несколько проблем,например, «Не удается прочитать свойство 'title' of undefined" (которое является свойством типа Game), а когда окончательно разрешается Games [], оно отображается так, как должно.Как я могу подавить эти ошибки?

Вторая проблема заключается в том, что в getGlobalProgress () мне нужен this.progress, на который раньше влияли getTasks ().Но getTasks () снова опаздывает и this.globalProgress никогда не устанавливается ...

Я думаю, мне нужны какие-то асинхронные вызовы, такие как обещания или наблюдаемые, я думал, что ".subscribe" было достаточно, но я былнеправильно.Я нашел много примеров кода в Интернете, но я не могу понять, какой использовать или как его использовать.Я был бы признателен за помощь, большое спасибо.

Вот файл ts соответствующего компонента:

export class SingleGameComponent implements OnInit {

private game: Game[];
private tasks: Task[];
private progress: Progress[];
private globalProgress: number;
private id: any; // Game id

constructor(private gameService: GameService, 
            private route: ActivatedRoute,
            private taskService: TaskService,
            private progressService: ProgressService) { }

ngOnInit() {
  this.id = this.route.snapshot.params['id'];
  this.getGames();
  this.getTasks();
  this.getGlobalProgress();
}

getGames(): void {
  this.gameService.getGameById(+this.id)
    .subscribe(game => this.game = game);
}

getTasks(): void{
  this.taskService.getTasksByGameId(+this.id)
    .subscribe(task => this.tasks = task);

  this.progressService.getProgressByUserAndGame(JSON.parse(localStorage.getItem('currentUser')).id, +this.id)
  .subscribe(progress => this.progress = progress);
}

getGlobalProgress(): void{
  this.progressService.calculateGlobalProgress(this.progress)
  .subscribe(globalProgress => this.globalProgress = globalProgress);
}

}

Вот один метод изсервис (они все одинаковые):

    getGameById(id: number){
  return this.httpClient.get<Game[]>(this.BASE_URL+'game/id/'+id);
}
...