Hello I'm kinda new to this things and I'm doing a get from pokemon API, this is the API URL I'm using.
This is my code :
import { Component, OnInit } from '@angular/core';
import { Pokemon, Pokemon2 } from 'src/app/classes/pokemon';
import { PokemonService } from 'src/app/services/pokemon.service';
@Component({
selector: 'app-table',
templateUrl: './table.component.html',
styleUrls: ['./table.component.css']
})
export class TableComponent implements OnInit {
pokemon:any[] = []
constructor(private pokemonservice: PokemonService) { }
ngOnInit(): void {
this.pokemonservice.getPokemon().subscribe((data:any)=>{
this.pokemon= data
console.log(this.pokemon)
})
}
}
I have a service who return only the http
the problem is that in my page it says OBJECT OBJECT, I know data is like this :
"count": 1126,
"next": "https://pokeapi.co/api/v2/pokemon/?offset=20&limit=20",
"previous": null,
"results": [
{
"name": "bulbasaur",
"url": "https://pokeapi.co/api/v2/pokemon/1/"
}
I usually had data's with only an object but here says also COUNT, NEXT, PREVIOUS, How can I do with this ?
There is no pokemon.name and pokemon.results is [object object] (Array of objects to be accurate).
Try this: {{ pokemon.results[0].name }}. It will give you the name of first pokemon. If you would like to list all pokemon names you can do this:
<div *ngFor="let pokemon of pokemon.results">
{{ pokemon.name }}
</div>