可访问性Ionic4路由焦点在页面底部

我在我的Ionic 4应用程序中有一个非常烦人的问题，当我更改页面时，屏幕阅读器焦点位于页面底部，这意味着我的用户必须反向浏览内容才能到达我的main内容部分。

我做了一些研究，这似乎是Angular 可访问性文档的问题Angular

在这里，他们建议您应该将重点放在main内容上。

但是，当我尝试使用以下方法时：

  ionViewDidEnter() {
    const mainHeader = document.querySelector('#mainContent');
    if (mainHeader) {
      (mainHeader as HTMLElement)?.focus();
    }
  }

它真的没有做任何事情。

有没有人遇到过类似的问题并知道我该如何解决？

编辑

我也尝试过viewChild：

  @ViewChild('mainPage') mainContent: ElementRef;    
  ngOnInit() {
    this.router.events.pipe(filter(e => e instanceof NavigationEnd)).subscribe(() => {
      this.mainContent.nativeElement.focus();
    });
  }

并设置mainPage元素的tabIndex=0：

<div #mainPage tabindex="0"><ion-router-outlet main></ion-router-outlet></div>

然而还是没有重点。