angular - 在 div 中使用 ngfor 不显示 restful api 响应的结果

Question

我有 RESTful api，它提供了类似的结果集

{
    "count": 10,
    "next": null,
    "previous": null,
    "results": [
        {
            "id": 1,
            "title": "Rocky (1976)",
            "description": "A small-time boxer gets a supremely rare chance to fight a heavy-weight champion in a bout in which he strives to go the distance for his self-respect.",
            "moviePoster": "http://127.0.0.1:8000/pic_folder/no-poster.jpeg",
            "avg_rating": 5,
            "no_of_ratings": 1,
            "maxRatings": 5
        },
        {
            "id": 2,
            "title": "Rocky (1976)",
            "description": "A small-time boxer gets a supremely rare chance to fight a heavy-weight champion in a bout in which he strives to go the distance for his self-respect.",
            "moviePoster": "http://127.0.0.1:8000/pic_folder/no-poster.jpeg",
            "avg_rating": 3.5,
            "no_of_ratings": 2,
            "maxRatings": 5
        }
    ]
}

在 component.ts 我有以下方法：

getMovies() {
this.movieService.getMovies().subscribe(
  response => {
    this.movies= response.JSON;
    console.log('response.JSON',response);
  },
  error => {
    this.snackBar.open('Error getting Movies', '', { duration: 3000 });
  }
);
  }

我正在尝试在 component.html 中打印“电影标题”，并且我关注了 div，但 html 页面上没有打印任何内容。

 <div class="container">
 <h2>Movies:</h2>
  <div *ngFor="let movie of movies;" >
  <h4>{{movie.title}}</h4>
</div>

标签： angular

Answer 1

做这个改变

this.movieService
.getMovies()
.subscribe( (response) => { this.movies = response.results;},