将数据传递到角度4中的自定义组件

Question

I have a custom component with a selector how do i pass data to it in angular 4 to show data in its template. like

<my-component data="shirts"></my-component>

And in my-component template

<h5>{{data.size}}</h5>

Not sure how to pass data down from parent to child component in angular 4.

Answer 1

If "data" variable it's an @Input() property, "data" should be between brackets to allow data binding.

<my-component [data]="shirts"></my-component>

You need to have this in your component:

@Input() data;

Don't forget to import "Input" from @angular/core