Skip to content

Bug: TranslocoPersistLangModule with TransferHttpCacheModule does not cache requests when not on default language. #495

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

Open
1 of 8 tasks
tiagomoucho3 opened this issue Sep 2, 2021 · 0 comments

Comments

@tiagomoucho3
Copy link

Current behavior

We are using Angular Universal with TransferHttpCacheModule and Transloco for translations.
Recently we have had to add cookies on server side with the help of some libraries ngx-cookie and ngx-cookie-backend.
Everything works fine for other cookies we have set, but we cannot seem to get TranslocoPersistLangModule with cookiesStorage to work.
We can see the translocoLang cookie in server.ts set properly, but when we check transloco active lang in app.component.ts it always returns the default one. We are using two languages, pt and en, with the former being the default one.

Expected behavior

When the user changes language, transloco new active lang is set and page is refreshed. We should see the page in the recent set language and not only after making client side requests to request the new language (which should not be being made, because they were already requests once in server side).
We are kinda lost and just need someone who can points us in the right direction.

Transloco config


@Injectable({ providedIn: 'root' })
export class TranslocoHttpLoader implements TranslocoLoader {
  constructor(private http: HttpClient) {}

  getTranslation(lang: string) {
    return this.http.get(`${environment.baseUrl}/assets/i18n/${lang}.json`);
  }
}

@NgModule({
  imports: [
    TranslocoMessageFormatModule.init(),
    TranslocoPersistLangModule.init({
      storage: {
        provide: TRANSLOCO_PERSIST_LANG_STORAGE,
        useValue: cookiesStorage(),
      },
    }),
  ],
  exports: [TranslocoModule],
  providers: [
    {
      provide: TRANSLOCO_CONFIG,
      useValue: translocoConfig({
        availableLangs: ['pt', 'en'],
        defaultLang: 'pt',
        fallbackLang: 'pt',
        missingHandler: {
          useFallbackTranslation: true,
        },
        prodMode: environment.production,
      }),
    },
    { provide: TRANSLOCO_LOADER, useClass: TranslocoHttpLoader },
  ],
})
export class TranslocoRootModule {}

Environment

- Transloco version: 2.21.0
- Angular version: 12.2.2

Browser:

  • Chrome (desktop) version XX
  • Chrome (Android) version XX
  • Chrome (iOS) version XX
  • Firefox version XX
  • Safari (desktop) version XX
  • Safari (iOS) version XX
  • IE version XX
  • Edge version XX
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant