How to use transloco in custom MatPaginatorIntl? #656
Answered
by
shaharkazaz
mariansimecek
asked this question in
Q&A
-
Hi I have a problem. I can't figure how to make transloco work with custom class MatPaginatorLanguageIntl that is provided in app.module.ts import { Injectable } from '@angular/core';
import { MatPaginatorIntl } from '@angular/material/paginator';
import { TranslocoService } from '@ngneat/transloco';
@Injectable()
export class MatPaginatorLanguageIntl extends MatPaginatorIntl {
constructor(private translateService: TranslocoService) {
super();
translateService.langChanges$.subscribe((lang) => {
this.setTranslations();
});
}
setTranslations() {
this.itemsPerPageLabel = this.translateService.translate(
'GENERAL.PAGINATOR.ITEMS_PER_PAGE_LABEL',
);
this.nextPageLabel = this.translateService.translate('GENERAL.PAGINATOR.NEXT_PAGE_LABEL');
this.previousPageLabel = this.translateService.translate(
'GENERAL.PAGINATOR.PREVIOUS_PAGE_LABEL',
);
this.firstPageLabel = this.translateService.translate('GENERAL.PAGINATOR.FIRST_PAGE_LABEL');
this.lastPageLabel = this.translateService.translate('GENERAL.PAGINATOR.LAST_PAGE_LABEL');
this.of = this.translateService.translate('GENERAL.PAGINATOR.OF');
}
of: string = '';
getRangeLabel = function (page: number, pageSize: number, length: number) {
if (length === 0 || pageSize === 0) {
return '0 ' + this.of + ' ' + length;
}
length = Math.max(length, 0);
const startIndex = page * pageSize;
// If the start index exceeds the list length, do not try and fix the end index to the end.
const endIndex =
startIndex < length ? Math.min(startIndex + pageSize, length) : startIndex + pageSize;
return startIndex + 1 + ' - ' + endIndex + ' ' + this.of + ' ' + length;
};
} On initial load it says missing translations, when route change it works. How to make it working on initial load? |
Beta Was this translation helpful? Give feedback.
Answered by
shaharkazaz
May 18, 2023
Replies: 1 comment 1 reply
-
Try listening to the translocoService.events$.pipe(
filter(e => e.type === 'translationLoadSuccess')
).subscribe(() => this.setTranslation()); or you can try to translocoService.selectTranslate([
'GENERAL.PAGINATOR.ITEMS_PER_PAGE_LABEL',
...
]).subscribe((translated) => ...) |
Beta Was this translation helpful? Give feedback.
1 reply
Answer selected by
mariansimecek
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Try listening to the
events
stream:or you can try to
selectTranslate
with the keys you need: