I am facing an issue where I am trying to send a value from a web service to another component. The problem is that the value appears empty in the other component, even though I can see that the value is present when I use console.log() in the current component.
AppComponent
ts
level: string = '';
getCustomer(id: string) {
this.isLoading = true;
this.customerService.getOne(id)
.subscribe(
(data) => {
this.level = data.level;
console.log(this.level); // The value is visible here
},
(error) => {
this.errorMessage = error;
},
);
}
html
<div class="col-lg-8">
<app-other-component [active]="level"></app-other-component>
</div>
AppOtherComponent
ts
@Input() active: string;
ngOnInit() {
console.log(this.active); // The output is an empty string here
}
It seems like the line
<app-other-component [active]="level"></app-other-component>