Question

我的Angular 7应用需要在iFrame中呈现。由于系统的特殊性质，我需要防止URL更改，或者也许我应该说我需要Angular不要期望URL更改。

我发现了一些帖子，展示了如何在特定的路由调用中阻止它，但是在应用程序加载时也会更新URL。

目标是维护URL，例如：website.com/applicaition，即使路由发生更改，使得window.location没有更新。

https://website.com/application [每个视图都需要] https://website.com/application/home [不需要任何视图]

谢谢，韦恩

Answer 1

如果您根本不想更新URL，则需要做两件事。

首先，添加：

{ initialNavigation: false }

对于这样的路由器设置：

const routes: Routes = [
  { path: 'home', component: HomeComponent },
  { path: '**', component: HomeComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes, { initialNavigation: false })],
  exports: [RouterModule]
})

不幸的是，我找不到一种全局更新方式，因此您需要为应用程序中的每个导航点设置以下内容。

通过路由器链接：

<a routerLink="/home" routerLinkActive="active" skipLocationChange="true" >Home</a>

使用ts导航呼叫：

router.navigate(['/home', { skipLocationChange: true }];

我希望这会有所帮助！

Answer 2

更好的方法是在总是返回false的根路由（或通配符）上实现路由保护。

@NgModule({
  imports: [
    RouterModule.forRoot([
      {
        path: '**',
        canActivate: [NeverActivate]
      }
    ])
  ],
  providers: [NeverActivate, UserToken, Permissions]
})


@Injectable()
class NeverActivate implements CanActivate {

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean>|Promise<boolean>|boolean {
    return false; // never allow activation
  }
}

如何使用Angular路由禁用URL更改

2 个答案: