Angular, Transloco service is not translating, but inside setTimeout it is translating

If I use this.translocoService.translate(title) inside setTimeout, it is translating. But without setTimeout, it says there is no translation.

import { Injectable } from '@angular/core';
import { Title } from '@angular/platform-browser';
import { RouterStateSnapshot, TitleStrategy } from '@angular/router';
import { TranslocoService } from '@ngneat/transloco';

@Injectable({
providedIn: 'root',
})
export class CustomTitleStrategyService extends TitleStrategy {
override updateTitle(snapshot: RouterStateSnapshot): void {
setTimeout(() => {
const title = this.buildTitle(snapshot);
const translation = this.translocoService.translate(title);
this.title.setTitle(translation);
}, 500);
}

constructor(
private title: Title,
private translocoService: TranslocoService,
) {
super();
}
}


Is there a way to remove setTimeout? because to me it looks like not proper solution

Continue reading...