Угловой сервисный метод для возврата данных после завершения асинхронных запросов

Question

У меня есть компонент, который звонит в службу для получения данных; initAllData().

Этот метод затем выполняет два запроса для некоторого json и использует forkJoin для манипулирования данными после их возвращения. Как только все данные были обработаны, я хочу вернуть новые данные (this.results) в методе, чтобы я получил их в своем компоненте.

Вот мой метод:

initAllData() {

// Get player data
this.players = this.getPlayersData();

// Get results data
this.scores = this.getResultsData();

forkJoin([this.players, this.scores]).subscribe(data => {

  // data[0] is the players
  // data[1] is the scores
  let playersArray = data[0].Players;
  let scoresArray = data[1].Results;

  // Populate the results array by merging each player with their scores based on the PlayerId
  this.results = playersArray.map(player => {
      return Object.assign(
        {}, 
        player, 
        scoresArray.find(score => score.PlayerId === player.PlayerId),
        {"Position": null}
      );
  });

  // Sort the results array from highest TotalScore to lowest
  this.results.sort((a, b) => b.TotalScore - a.TotalScore);

  // Add a position value to the results
  this.results.forEach((item, index) => {
    item.Position = index + 1;
  });
  console.log(this.results)

}); 

return this.results // this is undefined until forkJoin completes :(

}

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

Answer 1

Вам нужно вернуть наблюдаемое. Не подписывайтесь на initAllData, вместо этого

return forkJoin([this.players, this.scores]).pipe(
    map(([players, scores]) => {

// Do the assignments here, and return results in the end:
        return this.results;
    }));
//...

Теперь потребитель initAllData должен:

this.initAllData().subscribe(results => // now he has results

Answer 2

возврат с использованием обещания

initAllData() {
// Get player data
  this.players = this.getPlayersData();
  // Get results data
  this.scores = this.getResultsData();
  return new Promise((res,rej)=>
  {
    forkJoin([this.players, this.scores]).subscribe(data => {

      // data[0] is the players
      // data[1] is the scores
      let playersArray = data[0].Players;
      let scoresArray = data[1].Results;

      // Populate the results array by merging each player with their scores based on the PlayerId
      this.results = playersArray.map(player => {
          return Object.assign(
            {}, 
            player, 
            scoresArray.find(score => score.PlayerId === player.PlayerId),
            {"Position": null}
          );
      });

      // Sort the results array from highest TotalScore to lowest
      this.results.sort((a, b) => b.TotalScore - a.TotalScore);

      // Add a position value to the results
      this.results.forEach((item, index) => {
        item.Position = index + 1;
      });
      console.log(this.results)
      res(this.results)
    });
  });
}

Позвонить как: -

initAllData().then(data=>console.log(data));

Answer 3

Возвращение forkJoin обещание от сервиса. Обещание forkJoin должно возвращать объединенный результат всех данных (this.results в вашем случае).