We are going to create a simple to show information about one movie. This app is going to consist of only two components: the MovieComponent that shows information about the movie and the AppComponent which holds a reference to the movie with buttons to perform some actions.

Our AppComponent will have three properties: the slogan of the app, the of the movie and the lead actor. The last two properties will be passed to the MovieComponent element referenced in the template.

In the above code snippet, we can see that our component defines two buttons that trigger different methods. The changeActorProperties will update the lead actor of the movie by directly changing the properties of the actor object. In contrast, the method will change the information of the actor by creating a completely new instance of the Actor class.

The Actor model is pretty straightforward, it is just a class that defines the firstName and the lastName of an actor.

Finally, the shows the information provided by the AppComponent in its template.

app/movie.component.ts