当我点击一个重定向到产品详细信息页面的产品项目时，我试图隐藏一个ionic选项卡栏。我尝试使用其他生命周期方法，如ngAfterViewInit(), ngAfterViewChecked()，甚至尝试setTimeOut()。目前使用结构指令ngIf(),来隐藏组件，但它隐藏了所有路由，而不是指定的路由。我还尝试有条件地呈现它，但却完全破解了密码。
app.componet.ts:

@Component({
  template: `
    <app-tabbar> *ngIf="showComponent"></app-tabbar>
    <router-outlet></router-outlet>
  `,
})
export class AppComponent {
  showComponent: boolean = false;

  constructor(private router: Router) {
    this.router.events.forEach((event) => {
      if (event instanceof RoutesRecognized) {
        this.showComponent = true;
        console.log('URL', event.url);
        if (event.url.startsWith('/product/')) {
          console.log(' tabbar does show');
          this.showComponent = false;
        }
      }
    });
  }

app.component.html:

<div *ngIf="showComponent" class="showComponent">
    <app-tabbar></app-tabbar>
  </div>

值得一提的是，当分页时，我会得到一个错误，这是我以前从未见过的。看起来好像我试图在DOM访问它之前隐藏标签栏。
错误：

product.resolver.ts:27 ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'appendChild')

我想知道这是否与整个导航系统有关。
我的想法是，我们可以在path: 'tab-nav'和path: ''对象之间放置一个到外部PDP的路径，而不是仅仅将所有屏幕列为TabnavPage下的子对象。
我还看到一个网站，建议创建一个承诺，立即解决它，并添加一个处理程序与then()将运行在下一个滴答声。但这可能是功能等效的setTimeout(0)，所以可能不会有帮助。