Angular2重定向路由不会改变浏览器网址

试图在我的angular2应用中创建我的重定向路由。Angular2重定向路由不会改变浏览器网址

但我的问题是，当有人输入了“NOPATH”，那么用户会被重定向到“HomeComponent”，但网址仍然保持“/＃/ NOPATH”

路径无效，我想redirectTo路线也更改网址！我应该如何实现这一目标？

我应该把一个如果在我的HomeComponent构造函数，检查当前的网址，并改变他的路线homecomponent？或者有什么我失踪？

路线：

const routes: Routes = [ 
    { path: '', pathMatch: 'full', component: HomeComponent }, 
    { path: 'login', component: LoginComponent, canActivate: [AnonymousGuard] }, 
    { path: 'register', component: RegisterComponent, canActivate: [AnonymousGuard] }, 
    { path: 'users', component: UserComponent, canActivate: [AuthGuard] }, 
    { path: '**', redirectTo: '' } 
]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(routes, {useHash: true});

编辑：

想这一点，但我没有得到重定向到主成分

const routes: Routes = [ 
    { path: '', pathMatch: 'full' , redirectTo: 'home' }, 
    { path: 'home', component: HomeComponent }, 
    { path: 'login', component: LoginComponent, canActivate: [AnonymousGuard] }, 
    { path: 'register', component: RegisterComponent, canActivate: [AnonymousGuard] }, 
    { path: 'users', component: UserComponent, canActivate: [AuthGuard] }, 
    { path: '**', redirectTo: '' } 
];

来源

2016-12-31 Vince

也许不使用重定向路由，只需使用“**”，组件：HomeComponent（而不是重定向）。（NM尝试了几种方法，是的，我不会这样做）。 –

你使用的是最新的Angular2和路由器版本吗？最近我看到了类似的问题，在更新解决它的地方。 –

我使用3.2.3版本的路由器，我不知道如何检查我是否有最新版本 – Vince

现在，我没有找到任何更好的w比黑客Angular2路由器。

这是我的解决方案，它不是一个美丽的方式来解决问题......但至少它工作，因为我想！

路线：

const routes: Routes = [ 
    { path: '', pathMatch: 'full', component: HomeComponent }, 
    { path: 'login', component: LoginComponent, canActivate: [AnonymousGuard] }, 
    { path: 'register', component: RegisterComponent, canActivate: [AnonymousGuard] }, 
    { path: 'users', component: UserComponent, canActivate: [AuthGuard] }, 
    { path: '**', component: HomeComponent, canActivate: [RedirectToHomeGuard] } 
]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(routes, { useHash: true });

RedirectToHomeGuard：

@Injectable() 
export class RedirectToHomeGuard implements CanActivate { 

    constructor(private router: Router) { } 

    canActivate() { 
    this.router.navigate(['/']); 
    return false; 
    } 
}

你们认为这可能是一个很好的解决方案？

来源

2016-12-31 17:55:12 Vince

你应该试试这个，

const routes: Routes = [ 
    { path: '', pathMatch: 'full', redirectTo:'home'}, 
    //<<<-----added redirectTo attribute 

    { path: 'home', component: HomeComponent },     
    //<<<----added this line 


    { path: 'login', component: LoginComponent, canActivate: [AnonymousGuard] }, 
    { path: 'register', component: RegisterComponent, canActivate: [AnonymousGuard] }, 
    { path: 'users', component: UserComponent, canActivate: [AuthGuard] }, 

    { path: '**', component: HomeComponent } //<<<--- updated line 
];

来源

2016-12-31 15:30:00 micronyks

它不起作用，它保留了网址中的nopath，我没有被重定向到HomeComponent – Vince

我也尝试了redirectTo：'home'，并且它在浏览器中保留了错误的url，我需要输入push进入第二次，所以它改变了网址bu重新加载应用程序完全... – Vince

**我需要推入第二次输入浏览器的网址，使应用程序重新加载和工作..但这是一个奇怪的行为，我希望我的用户编写一个不好的url被重定向到我的家庭组件与主页的URL，而无需重新加载应用程序 – Vince

也许是为时已晚，但我认为问题应该与基础href标记。我在我的index.html中使用了类似下面的代码：

<head> 
    <meta charset="utf-8"> 
    <title>MyCoolApp</title> 
    <base href="."> 
</head>

基本上使用href =“。”打破了路由。相反，如果你使用href =“/”来做这个伎俩。

<head> 
    <meta charset="utf-8"> 
    <title>MyCoolApp</title> 
    <base href="/"> 
</head>

所以，现在的路由作品和所有的非匹配的路由将结束在“**”的路径和自“/”作为基本URL找到* -bundle.js文件，他们将找到。我认为这就是为什么当你导航到“/”时，一切都可以再次运作。

来源

2017-10-09 19:47:52

Angular2重定向路由不会改变浏览器网址

回答

相关问题