0
Good night I’m consuming a film api at Angular. However I can not display in the template, the console.log is showing right, but I can not pass the value to template
My Component :
import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
public filmeId;
lista= new Object();
filmes = new Array();
apiUrl = 'https://api.themoviedb.org/3/movie/top_rated?api_key=13f85672f7128ad9667356e1904e0012&language=pt-BR&page=1';
constructor(private http: HttpClient) { }
ngOnInit(): void {
this.http // get todas os filmes
.get(this.apiUrl + "filmes/" + this.filmeId + "/filmes", {
headers: new HttpHeaders({
'X-Auth-Token': '13f85672f7128ad9667356e1904e0012'
})
})
.subscribe(data => {
this.lista = data;
console.log(this.lista);
this.lista = data;
// }
});
}
}
My Template :
<hr>
<h2>Top Filmes </h2>
<li *ngFor="let f of filmes">
{{f.id}} {{f.name}}
</li>
What appears on console.log?
– Marconi
The right movie api appears, with movie id, name, description, etc...
– Marcos Fernandes
Put in question will facilitate!
– Marconi
In that part:
.subscribe(data => {
 this.lista = data;
 console.log(this.lista);
 this.lista = data;
 // }

 });
would not be.subscribe(data =>
 this.filmes = data);
?– Marconi