javascript - 如何将值传递给组件？

Question

我有这个组件:

export class MyComponent {
    @Input() active:boolean;

    constructor() {
        console.log(this.active);
    }
}

您会注意到我声明了一个 Input，我这样传入:

<mycomponent
    [active]="1 == 1"></mycomponent>

加载时，构造函数中的日志语句记录 undefined。我做错了什么？

Answer 1

@Input 属性绑定(bind)首先仅在 ngOnInit 之后可用，

所以你应该这样做:

export class MyComponent {
    @Input() active:boolean; 

    ngOnInit() {
        console.log(this.active);
    }
}

也仅供引用:

来自文档:

ngOnInit Initializes the directive/component after Angular first displays the data-bound properties and sets the directive/component's input properties. Called once, after the first ngOnChanges.

更多关于 Life Cycle Hooks