Stack Overflow em Português Asked by Joao Vitor Franco on August 20, 2020
Bom dia senhores, estou utilizando a api do IGDB (Games) para a realização de um site angular 7(typescript), nela ao receber um JSON recebo apenas o ID de gênero, mas se na chamada contextualizar consigo receber dentro do json, o id e o name(dentro de um array secundário), gostaria de imprimir na tela de profile que estou criando todos os generos dentro do array secundário, ou caso não exista um “Não preenchido”, no caso do print a baixo, tentei realizar apenas um teste pegando a primeira posição do vetor, ele imprime, mas quando não existe nada ele da erro no restante da tela.
HTML :
<h3>{{game.name}}</h3>
<p><img src="https://images.igdb.com/igdb/image/upload/t_cover_big/{{game.cover.image_id}}.jpg">
<br><br><strong>Desenvolvedora:</strong> {{game.involved_companies[0].company.name}}
<br><br><strong>Engine:</strong> {{game.game_engines[0].name}}
<br><br><strong>Gêneros:</strong> {{game.genres[0].name}}
Service :
getGameById(id: string): Observable<Game[]> {
return this.http.post<Game[]>(`${FACELIST_API}` + '/games',`fields *, genres.name; where id = (${id});`, httpOptions);
E o typescript do componente.
export class GameprofileComponent implements OnInit {
games: Game[]
imgs: Cover[]
constructor(private gammelistService: GammelistService, private route: ActivatedRoute) { }
ngOnInit() {
this.gammelistService.getGameById(this.route.snapshot.params['id']).subscribe(
list => {
let containsCover = list.filter(function (elem, i, array) {
return elem.cover !== undefined;
});
this.games = containsCover;
});
}
}
E o JSON
[
{
"id": 81249,
"cover": {
"id": 67245,
"image_id": "m5v5rte27ri2rj8i0e1j"
},
"genres": [
{
"id": 12,
"name": "Role-playing (RPG)"
},
{
"id": 31,
"name": "Adventure"
}
]
}
]
Tente desta forma:
<div *ngIf="game">
<h3>{{game.name}}</h3>
<p><img src="https://images.igdb.com/igdb/image/upload/t_cover_big/{{game.cover.image_id}}.jpg">
<br><br><strong>Desenvolvedora:</strong> {{game.involved_companies[0].company.name}}
<br><br><strong>Engine:</strong> {{game.game_engines[0].name}}
<ng-container *ngIf="game?.genres; else naoPreenchido">
<br><br><strong>Gêneros:</strong>
<div *ngFor="let genre of game.genres">
{{genre.name}}
</div>
</ng-container>
<ng-template #naoPreenchido>
<br><br><strong>Gêneros:</strong> NÃO PREENCHIDO
</ng-template>
Answered by Marcos Filipe on August 20, 2020
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP