NgxTranslate is not working with HTTP interceptor

user_15261548 0
Viewed 193

I am using ngxtranslate to translate the application. It works like charm. Problem is that I have HttpInterceptor which is trying to get data from local storage in the beginning and shows a dialog if asking you if you want to load the last changes or dismiss.
Problem is that text here in the dialog is not translated and I don't know how to do it because everywhere it works.
HTTPInterceptor file

import { TranslateService } from '@ngx-translate/core';

        @Injectable()
        export class CacheInterceptor implements HttpInterceptor {
        
          constructor(private cacheService: HttpCacheService, private dialog: MatDialog, private translate: TranslateService) {}
        
          intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
            return from(this.handle(req, next));
          }
         .......
            const cachedResponse: HttpResponse<any> = 
             this.cacheService.get(reqId);
             if (cachedResponse) {
              console.log('cache hit');

              const dialogResult = await this.openDialog();
              if (dialogResult) {
              console.log('Loading item from cache');
              // return modifyied response
            .........
               async openDialog() {
                  const dialogData = new ConfirmationDialogModel(
                  await this.translate.instant('some.text'),
                  await this.translate.instant('some.anotherText')
               );
             ....

output is just some.text and some.anotherText What can I do to make it work please?

ngx-translate translate angular typescript javascript
2 Answers

You're using the this.translate.instant function (which returns a string not a promise) with await, which is not correct. You should either use the instant function without await or use this.translate.get('xyz').toPromise() function instead which returns an observable, then convert it to promise to be awaitable.

user_151596030

do you try it ?

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
openDialog()
return from(this.handle(req, next));
}
user_129363220
Related