Question

我正在使用角度4。我有一种情况，我必须使用router.navigate路由到另一个组件，如下所示。

url="/screenpath/firstScreen"
this._router.navigate(["/path/guided/"+url]);

将路由为

localhost:4200/path/guided/screenpath/firstScreen

根据我从其余终点获得的screenPath，设置网址是动态的。现在我的问题是

是否可以隐藏在浏览器中显示的网址部分。我不想隐藏完整的网址但只是“网址”，即我只想显示

本地主机：4200 /路径/引导/

我知道skipLocationChange会隐藏url.But这会隐藏我不想要的整个网址。

请帮助。非常感谢。

Answer 1

您可以像这样手动更改网址：

 window.history.pushState("", "", '/path/guided/');

请记住，此网址将保存在浏览器历史记录中，因此您应该直接处理用户路由到/ path / guided的情况。

因为你想要的东西在很多组件中都是通用的，所以我建议你使用它来提供服务。

service.ts：

import {NavigationEnd} from "@angular/router";

routerObservableInstance$;

 constructor(private router: Router){
  this.subscribeToRouteChange();
}

subscribeToRouteChange(){
   this.routerObservableInstance$ = this.
   .router
   .events
   .filter(event=>event instanceof NavigationEnd)
   subscribe(event => {
   if(event.urlAfterRedirects.indexOf('screenpath')!=-1){
      window.history.pushState("", "", '/path/guided/');
   }
 }
}

onDestroy(){
  this.routerObservableInstance.unsubscribe();
}

在服务中，您订阅任何路线更改并仅过滤掉“NavigationEnd”类型的事件（从@ angular / router导入）。然后您应检查您的路由器URL以及它是否包含screenpath（或您决定的任何其他字符串））您将路径更改为/ path / guided。

以角度2/4隐藏部分网址

1 个答案: