Passing Props to Child Component in Angular

You can also pass properties from a parent component to a child component. Let's see how this is done. In the parent component, we'll set the properties that we'll pass to the child component:

app/app.component.tsclass AppComponent {
  public name: string = 'john';
  public age: number = 25;
}

In the parent template, we take the attribute names into square properties. In this case, what is written as the attribute value will be interpreted as a property of the parent class:

app/app.component.html<user-data [name]="name" [age]="age"></user-data>