I am facing an issue with my app components where AppComponent acts as the parent and ConfigComponent as the child. In the constructor of AppComponent, a service call is made to set a variable but I encounter unexpected behavior when trying to access this variable in ConfigComponent.
// Simplified code snippet showcasing the problem
// Proper service imports and providers have been implemented
// AppComponent (the parent)
public configName: string = "";
constructor(//params here) {
console.log("App constructor called.");
this.getConfigName();
// Despite calling the service method to obtain the config name,
// the following line prints out an empty string instead of the retrieved name
console.log("Config name is: " + this.configName);
}
getConfigName() {
this.configService.getGATRConfigName()
.subscribe(res => this.configName = res;
console.log("Config name is: " + this.configName); // This prints out the proper name
);
}
// ConfigComponent (the child)
public configName: string = "";
constructor(private appParent: AppComponent) {
this.configName = this.appParent.configName;
// After execution of this line, configName remains empty
// If the parent component sets the variable correctly, this would work as intended
}
Upon manually setting configName in AppComponent:
this.configName = "Config Name Default";
The value stays and can be fetched from the child component as expected. However, the issue arises when this.configName reverts back to being empty unexpectedly. Any insights on why this might be happening?