Rendering Movies

Learn about the logic and templating of the MovieComponent in the Movies application.

We'll cover the following

Let’s now turn our attention towards implementing the required logic and templating for the MovieComponent.

The MovieComponent

The MovieComponent will be responsible for the following tasks:

  • Displaying the data for the supplied movie (for example, title, image, and so on).
  • Subscribing to the MoviesListenerService to manage changes with movie data.
  • Saving a selected movie as a favorite.
  • Displaying cast and crew information for a selected movie.
  • Removing a movie from the display.

We’ll be making use of Angular’s @Input() module, Ionic’s ModalController module, and the following custom services we covered earlier:

  • FavouriteMoviesService
  • MoviesListenerService

We’ll also use the MovieCreditsComponent, which we’ll be defining shortly.

The component logic

In the src/app/components/shared-components/movie/movie.component.ts class, we make the following changes (amendments highlighted):

Get hands-on with 1200+ tech skills courses.