How to access a nested array from an API in typescript

Question

I have an array of objects from an API. see image

and in my game.component.ts I tried to access to an array inside the main game array but I can't access to platforms name(array7) with typescript.

  constructor(
    private gamesService:GamesService,
    private router: Router,
  ) {
    this.game = new Game('', '', [],  '', [], 1 );
    console.log(this.game);
    this.gamesService.getListGames(this.page).subscribe( (data: any) =>{
      //console.log(data.results);
      console.log(data);
      this.gameslist = data.results;
      //this.count = data.results.length;
      console.log(this.count);
      //this.nextpage = game.next;
      console.log(this.nextpage);
      console.log(data.results);
      if(data.platforms == 'PC')
      {
         return this.pcIcon= '../assets/pc.png';
      }
     });

how to access to platforms.name in console.log(data.results " platform name" ????

to print in the console.log the platforms name of an object game, each game has various platforms name.

I am looking for the platforms name in typescript for later get an .png image for each platform.

To help you, first I would need to know what is the Screenshot showing us. Is that "console.log(data)"? — Victor Martinez Calvo
– Victor Martinez Calvo, Commented Dec 27, 2020 at 11:41

Victor Martinez Calvo · Accepted Answer · 2020-12-27 15:55:50Z

2

So, iiuc, the API is returning an array of 20 games in "data.results".Each Game has a "platforms" array.

To access the first Game you would need to use "data.results[0]", and to access the first Platform of the Game you would need to use "data.results[0].platforms[0]". If you want to loop through the platforms of the first game, then your code would be something like:

data.results[0].platforms.forEach((platform)=> { 
    if (platform == "PC") {
        //Your code here
    }
}

To loop all the games and all its platforms:

data.results.forEach((game) => {
    //Looping Platform for each game
    game.platforms.forEach((platform)=> { 
            //your code here
        }
}

edited Dec 27, 2020 at 15:55

answered Dec 27, 2020 at 11:52

Victor Martinez Calvo

2,5651 gold badge16 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Rafael Hernández Over a year ago

but the code works but I need the platform name of every platforms in the objet game in all games not only the first how to do dinamyc the data.results['this dinamyc'].platforms.forEach...

Victor Martinez Calvo Over a year ago

As I stated, to help you I need to know what the subscription to getListGame is returning (a Screenshot please) and the most important thing: what are you expecting your code to do. You're missing a good and clear description of your goal. Thanks!

Rafael Hernández Over a year ago

grand theft auto V has 7 platforms I need to get the 7 names in this game other games have 4 or 3 platforms

Rafael Hernández Over a year ago

Release on = platform

Victor Martinez Calvo Over a year ago

Ok. But which is the structure you want to obtain? I mean your request is returning 20 Games, each game has several Platforms. Which is the structure where you want to save the data? Would this.GamesPlatform being an Array of 20 elements where each element is an array of platforms would be good enough? Or what exactly do you need? Or do you want to create an Array of Games[] extracting the info from the response of the request? Thanks!

|

Collectives™ on Stack Overflow

How to access a nested array from an API in typescript

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related