In parent component I have:
<app-access-password [profileId]="getProfileId(kid.getId())"></app-access-password>
Where getProfileId(kid.getId() returns number if kid. I can see this value in template:
{{getProfileId(kid.getId())}} it is not empty.
WhenI try to get profileId value inside component app-access-password:
@Input() profileId: number;
constructor() {
console.log(this.profileId)
}
I got undefined message. Why?
you need to access after the view has been loaded, move it to ngOnInit() method
@Input() profileId: number;
ngOnInit() {
console.log(this.profileId)
}
Even though the answer is accepted ,i would like to differ .
You can access it in ngOnChanges() .
ngOnChanges is called even before ngOnInint() .
ngOnChanges(changes : SimpleChanges){
//changes.profileId will store both the previous and the current value .
}
so as soon as the @Input() kicks in(value is changed from null to a defined value) , ngOnChanges is automatically called so you don't have to wait for component ngOnInit
You will have to load after ngOnInit()
@Input() profileId: number;
ngOnInit() {
console.log(this.profileId)
}
ngOnChanges(){
// you can access value everytime `this.profileId` value changes
}
Angular life hooks design says, all input value you can access after constructor.
You can access it from init .
@Input() profileId: number;
ngOnInit() {
console.log(this.profileId);
}
@Input() profileId: number;
ngOnInit() {
}
console.log(this.profileId)
you can access inside class any anywhere
ngOnInit, not in the constructor