Nvda screen-reader reads "PageTitle document blank" when navigating one route to another in Angular

Question

The issue observed is that when transitioning from one page to another, the speech reader reads the title of the previous page followed by a 'document blank' string while the next page is loading. This issue persists despite utilizing the titleService to assign specific page titles within individual components in Angular.

In app.component.html

<div id="main-content-wrap" tabindex="-1"></div>
<div class="content">
  <router-outlet> </router-outlet>
</div>

and from app.module.ts

router.events.subscribe((event: RouterEvent) => {
      this.onNavigation(event);
 });


public onNavigation(event: RouterEvent): void {
    if (event instanceof NavigationStart) {
      this.preloaderService.show();
    }
    if (event instanceof NavigationEnd) {
      this.setBodyFocus(event);
      this.preloaderService.hide();
    }
  }


private setBodyFocus(event: NavigationEnd) {
    const bodyElement = $('#main-content-wrap')[0];
    bodyElement.focus();
}

but on screen reader it displayed like this "PageTitle Document Blank" Image Click Here

Expected : screen reader not read the previous page title document blank string.