angular19 - angular 19 - APP_INITIALIZER deprecation - Stack Overflow

admin管理员组

文章数量:1332345

I am trying to upgrade from Angular 18 to 19. Automatic migration changed the following code

 providers: [
    { 
      provide: APP_INITIALIZER, 
      useFactory: initializeApp1, 
      deps: [AuthService], 
      multi: true 
    },
  ]

to this:

 providers: [
  provideAppInitializer(initializeApp1(inject(AuthService)))
 ]

however, when I run the code, I am getting this error

Uncaught RuntimeError: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with runInInjectionContext. Find more at /errors/NG0203`

I am pretty stuck as to how to solve this error, could you help me?

I am trying to upgrade from Angular 18 to 19. Automatic migration changed the following code

 providers: [
    { 
      provide: APP_INITIALIZER, 
      useFactory: initializeApp1, 
      deps: [AuthService], 
      multi: true 
    },
  ]

to this:

 providers: [
  provideAppInitializer(initializeApp1(inject(AuthService)))
 ]

however, when I run the code, I am getting this error

Uncaught RuntimeError: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with runInInjectionContext. Find more at https://angular.dev/errors/NG0203`

I am pretty stuck as to how to solve this error, could you help me?

• angular
• angular19

Share Improve this question Follow edited Nov 21, 2024 at 19:59 Chait 1,32522 gold badges2222 silver badges3737 bronze badges asked Nov 20, 2024 at 21:14 IgorIgor 81422 gold badges1313 silver badges3737 bronze badges 1

• This is actually a bug in the migration itself. A fix is pending : github/angular/angular/pull/58518 – Matthieu Riegler Commented Nov 20, 2024 at 23:54

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 13

You'll need wrap the initializer in an arrow function to be in the injection context:

provideAppInitializer(() => intializeApp1(inject(AuthService)))

During ng update @angular/core@19 @angular/cli@19 you'll see this message:

** Optional migrations of package '@angular/core' **

This package has 1 optional migration that can be executed.
❯ Replaces `APP_INITIALIZER`, `ENVIRONMENT_INITIALIZER` & 
`PLATFORM_INITIALIZER` respectively with `provideAppInitializer`, 
`provideEnvironmentInitializer` & `providePlatformInitializer`.
  ng update @angular/core --name provide-initializer

Just do what is says and run ng update @angular/core --name provide-initializer and it should remove APP_INITIALIZER for you and replace it with the correct code.

Had the same issue: The bellow resolved it for me.

provideAppInitializer(()=> {

  const initFn = ((key: KeycloakService) => {
    return () => key.init({
      config: {
        url: 'sso_url',
        realm: 'realm',
        clientId: 'client_id'
      },
      initOptions: {
        onLoad: 'check-sso',
        silentCheckSsoRedirectUri: window.location.origin + '/assets/silent-check-sso.html'
      }})
  })(inject(KeycloakService));
  return initFn();
}),

本文标签： angular19angular 19APPINITIALIZER deprecationStack Overflow