I'm currently developing an Angular application that utilizes Angular Universal for server-side rendering functionality.
One interesting aspect of my project involves passing a string dependency token as a provider within the providers array in server.ts.
providers: [{ provide: 'MODEL', useValue: process.env.API_MODEL }]
The challenge I face relates to accessing the value associated with this token from my components.
After reviewing my app.component.ts, I attempted the following:
export class AppComponent {
constructor(@Optional() @Inject('MODEL') private model: string) {
console.log('inside app component', this.model)
}
}
When checking the terminal, it correctly displays inside app component DELUXE in line with the .env file. However, the browser console yields inside app component null. Why does the value not display in the browser?
If the @Optional() decorator is removed, a
NullInjectionError: No provider for MODEL!