how to assign value outside of a PROMISE from inside

Question

export class YoutubeService {

  getTrendingVideos(country) {
    let result = [];
    return axios.get('/').then(function(res){
      result = res.data.items;
      for (var i = 0; i < result.length; i++) {
        result[i] = {
          id: result[i].id,
          title: result[i].snippet.title,
          thumbnail: result[i].snippet.thumbnails.high.url,
          publishedAt: moment(result[i].snippet.publishedAt).fromNow()
        };
        result[i]= YoutubeService.getVideoDetails(result[i]).then(
            (video)=> 
              {
                  return video;
              }
        ); //result[i] is not getting resolved
        console.log(result[i]); // it returns Promise { <pending> }
      }
      return result;
    });

  }

  static getVideoDetails(video) {
    return axios.get('/').then(function(res) {
      let result = res.data;
      video.viewCount = result['items'][0].statistics.viewCount;
      video.likeCount = result['items'][0].statistics.likeCount;
      return video;
    });
  }
}

How can I assign a value to 'result[i]' array from inside '.then()'. For now it comes out to be empty. Error that returns is Promise { <pending> }. Thanks in advance.

Answer 1

Promise.all() will resolve when a passed array of promises has resolved.

The code should collect the promises made by getVideoDetails() and return a promise to perform those requests...

  getTrendingVideos(country) {
    let result = [];
    let promises = [];
    return axios.get('/').then(function(res){
      result = res.data.items;
      for (var i = 0; i < result.length; i++) {
        result[i] = {
          id: result[i].id,
          title: result[i].snippet.title,
          thumbnail: result[i].snippet.thumbnails.high.url,
          publishedAt: moment(result[i].snippet.publishedAt).fromNow()
        };
        promises.push( YoutubeService.getVideoDetails(result[i]) )
      }
      return Promise.all(promises);
    });
  }