Angular 2 如果路径不存在，如何重定向到 404 或其他路径

javascript angular angular2-routing

2022-08-30 05:13:39

我试图重定向404其他路径，如果路径不存在于角度2/

我尝试研究有一些方法可以用于角1，但不是角2。

这是我的代码：

@RouteConfig([
{
    path: '/news',
    name: 'HackerList',
    component: HackerListComponent,
    useAsDefault: true
},
{
    path: '/news/page/:page',
    name: 'TopStoriesPage',
    component: HackerListComponent
},
{
    path: '/comments/:id',
    name: 'CommentPage',
    component: HackerCommentComponent
}
])

举个例子，如果我重定向到，那么它的工作原理，它返回给我一个空页面，你如何处理这种情况发生？/news/page/

答案 1

对于版本 v2.2.2 及更高版本

在版本 v2.2.2 及更高版本中，name 属性不再存在，不应用于定义路由。应使用 path 而不是 name，并且路径上不需要前导斜杠。在本例中，请使用代替：path: '404'path: '/404'

 {path: '404', component: NotFoundComponent},
 {path: '**', redirectTo: '/404'}

对于早于 v2.2.2 的版本

您可以使用：{path: '/*path', redirectTo: ['redirectPathName']}

{path: '/home/...', name: 'Home', component: HomeComponent}
{path: '/', redirectTo: ['Home']},
{path: '/user/...', name: 'User', component: UserComponent},
{path: '/404', name: 'NotFound', component: NotFoundComponent},

{path: '/*path', redirectTo: ['NotFound']}

如果没有匹配的路径，则重定向到路径NotFound

答案 2

随着Angular继续发布，我遇到了同样的问题。根据2.1.0版本，界面看起来像：Route

export interface Route {
    path?: string;
    pathMatch?: string;
    component?: Type<any>;
    redirectTo?: string;
    outlet?: string;
    canActivate?: any[];
    canActivateChild?: any[];
    canDeactivate?: any[];
    canLoad?: any[];
    data?: Data;
    resolve?: ResolveData;
    children?: Route[];
    loadChildren?: LoadChildren;
}

所以我的解决方案如下：

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