Angular的*ngIf在重新路由时不起作用

Angular的ngIf指令用于根据条件来显示或隐藏DOM元素。然而，在重新路由时，ngIf可能不起作用的原因可能是由于路由的重新加载导致组件被销毁和重新创建。

解决这个问题的一种方法是使用Angular的路由守卫。路由守卫允许我们在路由发生变化之前或之后执行一些操作。我们可以使用路由守卫来检查条件并决定是否允许路由继续。

以下是一个示例，演示如何在重新路由时使用路由守卫来处理*ngIf不起作用的问题：

创建一个名为AuthGuard的路由守卫服务：

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class AuthGuard implements CanActivate {

  constructor(private router: Router) { }

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    // 在这里检查条件，例如用户是否已登录
    const isLoggedIn = true; // 假设用户已登录

    if (!isLoggedIn) {
      // 如果条件不满足，重定向到登录页面或其他页面
      this.router.navigate(['/login']);
      return false;
    }

    return true;
  }
}

在路由模块中使用AuthGuard：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home.component';
import { AuthGuard } from './auth.guard';

const routes: Routes = [
  {
    path: 'home',
    component: HomeComponent,
    canActivate: [AuthGuard] // 使用AuthGuard作为路由守卫
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class HomeRoutingModule { }

在上面的示例中，AuthGuard用于检查条件（例如用户是否已登录），如果条件不满足，则重定向到登录页面或其他页面。通过将AuthGuard应用于路由，我们可以确保在重新路由时执行条件检查。

请注意，这只是解决*ngIf在重新路由时不起作用的一种方法之一。根据具体情况，可能还有其他解决方案，例如使用路由复用策略等。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云负载均衡（CLB）。