Question

我有一个显示错误404的页面。但只有在用户输入了无效的网址时才会打开该页面。如果控制台显示如此错误，如何使其出现：＆＃34;无法加载资源：服务器响应状态为404（未找到）＆＃34;。例如，如果显示id为86的远程用户，则显示空白页，而在控制台中，错误为404。并且您需要这样做，以便显示包含404错误的页面而不是此空白页面。

谁知道怎么做？有什么例子吗？

import { Routes, RouterModule }  from '@angular/router';

import { ModuleWithProviders } from '@angular/core';

import { AdministrationComponent } from '../pages/administration/administration.component';

import { ProfileComponent } from '../pages/profile/profile.component';

import { UsersComponent } from '../pages/users/users.component';
import { UserShowComponent } from '../pages/users/user-show/user-show.component';

import { NotFoundComponent } from '../not-found/not-found.component';

import { LayoutComponent } from '../layout.component';


export const routes: Routes   = [
    {
        path: 'layout',
        component: LayoutComponent,
        children: [
            { path: '', redirectTo: 'profile', pathMatch: 'full' },
            { path: 'administration',  component: AdministrationComponent},
            { path: 'profile',  component: ProfileComponent},
            { path: 'users',  component: UsersComponent},
            { path: 'users/:id',  component: UserShowComponent},
            { path: '**', component: NotFoundComponent }

        ]
    }
];

export const routing: ModuleWithProviders = RouterModule.forChild(routes);

Answer 1

首先在app-routing.module

中添加'**'之前的另一个路径

import { Routes, RouterModule }  from '@angular/router';

import { ModuleWithProviders } from '@angular/core';

import { AdministrationComponent } from '../pages/administration/administration.component';

import { ProfileComponent } from '../pages/profile/profile.component';

import { UsersComponent } from '../pages/users/users.component';
import { UserShowComponent } from '../pages/users/user-show/user-show.component';

import { NotFoundComponent } from '../not-found/not-found.component';

import { LayoutComponent } from '../layout.component';


export const routes: Routes   = [
    {
        path: 'layout',
        component: LayoutComponent,
        children: [
            { path: '', redirectTo: 'profile', pathMatch: 'full' },
            { path: 'administration',  component: AdministrationComponent},
            { path: 'profile',  component: ProfileComponent},
            { path: 'users',  component: UsersComponent},
            { path: 'users/:id',  component: UserShowComponent},
            { path: 'error404', component: NotFoundComponent },
            { path: '**', redirectTo: '/error404' }

        ]
    }
];

export const routing: ModuleWithProviders = RouterModule.forChild(routes);

然后对于每个组件，您使用api服务，并从api收到错误，导航到NotFoundComponent。

ngIninit(){
    this.myService.getUser().subscrible(
        (data: any) => {},
        (error: any) => {
            this.router.navigate(['/error404']);
        }
   );

Answer 2

请访问链接

this question

您可以通过状态处理错误，请点击此链接。

https://medium.com/@amcdnl/global-error-handling-with-angular2-6b992bdfb59c

我相信这对你来说非常有用。

谢谢，

Karnan Muthu

如何显示404页面？

2 个答案: