I am facing issue with NGXS in Angular 18 with almost all standalone components. I have applied lazy loading for components. While I am switching from roles and users page it also calling roles actions which is in ngOnInit of the roles component. similarly when switching from users to roles same thing is happening.

In routes file

export const routes: Routes = [
  { path: 'login', component: LoginComponent, canActivate: [loginGuard] },
  {
    path: '',
    component: AppLayoutComponent,
    canActivate: [authGuard],
    children: [
      {
        path: '',
        redirectTo: '/dashboard',
        pathMatch: 'full',
      },
      {
        path: 'members/roles',
        canActivate: [authGuard],
        loadComponent: () => import('./features/members/roles/roles.component').then(m => m.RolesComponent),
        providers: [provideStates([RolesState])]
      },
      {
        path: 'members/users',
        canActivate: [authGuard],
        loadComponent: () => import('./features/members/users/users.component').then(m => m.UsersComponent),
        providers: [provideStates([UserState])]
      },
      
    ],
  },
];

In appConfig file

export const appConfig: ApplicationConfig = {
  providers: [
    MessageService,
    provideZoneChangeDetection({ eventCoalescing: true }),
    provideRouter(routes),
    importProvidersFrom(AppLayoutModule),
    provideHttpClient(),
    provideStore([]),
    withNgxsReduxDevtoolsPlugin()
  ],
};

Tried with separate route file for members.