Accessing a child component in a parent component class using ViewChild

In this recipe, you’ll learn how to use the ViewChild decorator to access a child component in a parent component’s class. You’ll start with an app that has AppComponent as the parent component and GalleryComponent as the child component. You’ll then create a ViewChild for the child component in the parent’s component class to access it and perform some actions.

Getting ready

The project that we are going to work with resides in chapter01/start_here/cc-view-child inside the cloned repository:

1. Open the code repository in your code editor.
2. Open the terminal, navigate to the code repository directory, and run the following command to serve the project:

   npm run serve cc-view-child to serve the project.
   

   This should open the app in a new browser tab, and you should see something like the following:

   

   Figure 1.16: The cc-view-child...