輸入屬性的簡單示例

父元素 html

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

父元素 ts

export class AppComponent {
     inputPropValue: true
}

子元件 ts:

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

子元件 html:

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

此程式碼將 inputPropValue 從父元件傳送到子元件,它將具有我們在父元件到達時設定的值 - 在我們的示例中為 false。然後我們可以在子元件中使用該值,例如向類新增一個類。