Within my Angular project, I have a service file where I export a variable to be used in another file (component.ts).
Interestingly, when I access the value of this variable outside of the class, everything works as expected. However, if I try to access it within any function declared inside the component class, I encounter an error stating that the variable is not defined.
As every module in Angular has its own scope and TypeScript files are converted into JavaScript with classes becoming functions, I expect variables outside of functions to be available. Strangely, though, assigning the variable to a declared variable outside the class seems to resolve the issue.
I am puzzled by this behavior. Can anyone help me understand what I might be missing?
import {UserService ,b} from './services/user.service';
console.log(b); // This works
// var t = b; // Also working
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
providers:[UserService]
})
export class AppComponent implements DoCheck, AfterContentInit, AfterContentChecked {
title = 'project';
a:any = "joshi";
constructor(private vc: ViewContainerRef, private user: UserService) {
console.log("parent constr");
}
update() {
// t = "changed"; // This works
// b = "changed"; // Does not work
this.user.setObservable();
}
}