javascript - 从数组中获取内部对象

Question

我有一个名为 MovieSearchComponent 的组件。这会导入一个服务 MovieSearchService 和一个模型 Movie。

@Component({
  selector: 'movie_search',
  templateUrl: './movie_search-component.html',
  providers: [MovieSearchService]
})

export class MovieSearchComponent{
  movies: Movie[] = [];

  constructor(private movieSearchService: MovieSearchService){};

  ngOnInit(){
    this.getMovies();
  }

  getMovies(){
    this.movieSearchService.getMovies()
      .subscribe((response)=>{
        this.movies = response;
        console.log(this.movies)
      });
  }
}

服务。

import {Movie} from "../movie";

@Injectable()
export class MovieSearchService{

  private results = {};
  private api = '***7039633f2065942cd8a28d7cadad4';
  private  url = 'https://api.themoviedb.org/3/search/movie?api_key=' + this.api + '&language=en-US&query=Batman&page=1&include_adult=false;';

  constructor(private  http: Http){}

  getMovies(): Observable<Movie[]>{
    return this.http.get(this.url)
      .map(res => res.json())
  }
}

模板:

<div>
  <ul>
    <li *ngFor="let movie of movies.results">
      {{ movie.title }}
    </li>
  </ul>
</div>

这确实显示了从服务返回的电影的所有标题。但我必须选择包含模板中所有电影对象的结果数组，这对我来说看起来不正确。

当我将 MovieSearchComponent 中的 console.log(this.movi​​es) 更改为 console.log(this.movi​​es.results) 时我收到错误Movie[] 类型上不存在属性“结果”。

这是电影模型:

export class Movie{
  constructor(
    public id: number,
    public title: string,
  ){}
}

那么，当我可以在模板中使用 console.log(this.movi​​es.results) 时，为什么我不能使用它。

Answer 1

因为结果未在 Movie 类中定义。

将 getMovies 方法更改为:

 getMovies(): Observable<Movie[]>{
    return this.http.get(this.url)
      .map(res => res.json().results)
  }