While a root component represents the container for an Angular app, you will also need other components that are direct or indirect descendants of a root component. When a root component is rendered, it will also render all its children components.
These child components can receive data from their parent component and can also send data back. Let's view some of these concepts at play in a more complex example that builds on the previous one. Note that, in the Example1, we suggested that a child component can be inserted within the root component template; one such child component is defined like this:
import { Component, Input, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'div[my-child-comp]', ...
