捕获http错误代码500时显示一个漂亮的div

Question

我创建了一个简单的ErrorHandler类，它看起来像是：

export class AppErrorHandler implements ErrorHandler {

    handleError(error : any){
        //console.log('test error ', error.status);
        if(error.orginalError.status === 500){
            alert('An unexpected error occured 500');
            console.log('from AppErrorHandler ', error);
        }
        else {
            alert('An unexpected error occured');
            console.log('from AppErrorHandler ', error);
        }   
    }
}

正如您所看到的，我只在发生错误时在页面上显示alert。经过一段时间的挖掘后，我还没有找到一个解决方案来在任何类型的div中使用bootstrap类alert alert-danger显示该错误。一般来说可能吗？

Answer 1

我认为您应该执行以下操作：

• 创建包含错误的服务
• 在错误处理程序中，将错误添加到errorService
• 创建一个将成为您＆＃34;漂亮div＆＃34;
的组件
• 将此组件放入AppComponent，以便始终可见。

Answer 2

如果你想使用第三方库，有一个很棒的软件包“angular2-notifications”来显示通知。

以下是获取它的链接：

  

https://www.npmjs.com/package/angular2-notifications

...你可以在这里找到文档：

  

https://jaspero.co/resources/projects/ng-notifications

...当然还有源代码和示例：

  

https://github.com/flauc/angular2-notifications