Angular 2 Simple example of Input Properties


Parent element html

<child-component [isSelected]="inputPropValue"></child-component>

Parent element ts

export class AppComponent {
     inputPropValue: true

Child component ts:

export class ChildComponent {
    @Input() inputPropValue = false;

Child component html:

<div [class.simpleCssClass]="inputPropValue"></div>

This code will send the inputPropValue from the parent component to the child and it will have the value we have set in the parent component when it arrives there - false in our case. We can then use that value in the child component to, for example add a class to an element.