Передача свойств в дочерний компонент в Angular

Можно также передавать свойства родительского компонента в дочерний. Давайте посмотрим, как это делается. В родительском компоненте зададим свойства, которые мы будем передавать в дочерний компонент:

class AppComponent { public name: string = 'john'; public age: number = 25; }

В темплейте родителя возьмем имена атрибутов в квадратные свойства. В этом случае то, что написано в качестве значения атрибута, будет интерпретировано как свойство класса родителя:

<user-data [name]="name" [age]="age"></user-data>

В родительском компоненте сделайте свойства для названия и цены продукта. Передайте их значения в ваш дочерний компонент.