Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[angular] DynamicLayoutComponent didn't work when with a long time APP_INITIALIZER #5229

Closed
yinchang0626 opened this issue Aug 30, 2020 · 1 comment · Fixed by #5609
Closed

Comments

@yinchang0626
Copy link
Contributor

@mehmet-erim :Hi,
I think I find a bug about GetAppConfiguration Action and create a branch to test it

1.Add a APP_INITIALIZER provider to AppModule:

@NgModule({
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    CoreModule.forRoot({
      environment,
      sendNullsAsQueryParam: false,
      skipGetAppConfiguration: false,
    }),
    ThemeSharedModule.forRoot(),
    AccountConfigModule.forRoot(),
    IdentityConfigModule.forRoot(),
    TenantManagementConfigModule.forRoot(),
    SettingManagementConfigModule.forRoot(),
    NgxsModule.forRoot(),
    ThemeBasicModule.forRoot(),
    ...(environment.production ? [] : LOGGERS),
  ],
  providers: [
    APP_ROUTE_PROVIDER,
    {
      provide: APP_INITIALIZER,
      useFactory: function () {
        return () => new Promise(resolve => setTimeout(resolve, 1000));
      },
      multi: true,
    }
  ],
  declarations: [AppComponent],
  bootstrap: [AppComponent],
})
export class AppModule { }

Then DynamicLayoutComponent didn't work fine when first time to load page:
ezgif com-optimize

2.something wrong withGetAppConfiguration Action

@Action(GetAppConfiguration)
  addData({ patchState, dispatch }: StateContext<Config.State>) {
    const apiName = 'default';
    const api = this.store.selectSnapshot(ConfigState.getApiUrl(apiName));
    return this.http
      .get<ApplicationConfiguration.Response>(`${api}/api/abp/application-configuration`)
      .pipe(
        tap(configuration =>
          patchState({
            ...configuration,
          }),
        ),
        switchMap(configuration => {
          let defaultLang: string =
            configuration.setting.values['Abp.Localization.DefaultLanguage'];

          if (defaultLang.includes(';')) {
            defaultLang = defaultLang.split(';')[0];
          }

          document.documentElement.setAttribute(
            'lang',
            configuration.localization.currentCulture.cultureName,
          );
          return this.store.selectSnapshot(SessionState.getLanguage)
            ? of(null)//=>OK:works fine
            : dispatch(new SetLanguage(defaultLang, false));//=>NG:first time load page will return this 
        }),
        catchError((err: HttpErrorResponse) => {
          dispatch(new RestOccurError(err));
          return throwError(err);
        }),
      );
  }

According to above code,
if addData(GetAppConfiguration Action) method finally return of(null) it will works perfect
but if it return dispatch(new SetLanguage(defaultLang, false)) ,will must have this error.
I think this bug is about ngxs/store,but in a angular app ,APP_INITIALIZER is a very often used,
Could you help me to check this? thank you

@yinchang0626 yinchang0626 changed the title [angular bug] DynamicLayoutComponent didn't work when with a long time APP_INITIALIZER [angular] DynamicLayoutComponent didn't work when with a long time APP_INITIALIZER Aug 30, 2020
@mehmet-erim mehmet-erim self-assigned this Aug 31, 2020
@mehmet-erim mehmet-erim added this to the 3.2 milestone Aug 31, 2020
@mehmet-erim mehmet-erim modified the milestones: 3.2, 3.2-final Sep 17, 2020
@mehmet-erim
Copy link
Contributor

Hi @yinchang0626
Sorry for the late response.

I have raised a PR that will be fixed the problem.
Thanks for reporting.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants