Question

我试图在Angular 2（typescript）中执行以下操作：对于每个错误（尤其是来自后端服务器的错误） - 将错误呈现给用户（在UI中） - 在主要组件中（主要是因为我不想在每个组件中编写相同的代码。）

这是一种简单的方法吗？我想我需要的是一种设置＆＃34;错误的方法＆＃34;成员在主要组成部分？如果我覆盖ExceptionHandler，我该怎么办？

感谢名单，保尔。

Answer 1

在共享目录中创建NotificationService

import { ErrorHandler, Inject } from '@angular/core';
import { NotificationService } from './notification.service';


export class CustomErrorHandler implements ErrorHandler {

    constructor(@Inject(NotificationService) private notificationService: NotificationService) {
    }

    handleError(error: any): void {
        this.showErrorInConsole(error);
        setTimeout(() => 
            this.notificationService.error(error.json().Message), 1);
    }

    private showErrorInConsole(error: any) :void {
        if (console && console.group && console.error) {
            console.group("Error Log");
            console.error(error);
            console.error(error.message);
            console.error(error.stack);
            console.groupEnd();
        }
    }
}

在共享目录中创建自定义ExceptionHandler（RC 6中的ErrorHandler）

import { GrowlModule } from 'primeng/primeng';
...
import { NotificationService } from './shared/notification.service';
import { CustomErrorHandler } from './shared/custom-error-handler';

@NgModule({
    imports: [
        ...,
        GrowlModule // prime ng notification
    ],
    declarations: [
        ...
    ],
    providers: [
        ...,
        NotificationService, // added
        { provide: ErrorHandler, useClass: CustomErrorHandler } // overrride default error handler
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

更新AppModule以覆盖默认错误处理程序

import { Component } from '@angular/core';
import { Message } from 'primeng/primeng';
import { NotificationService } from './shared/notification.service';


@Component({
    selector: 'my-app',
    template: `
        <p-growl [value]="getMessages()"></p-growl>
    `
})
export class AppComponent{
    constructor(private notification: NotificationService) {
    }

    getMessages(): Message[] {
        return this.notification.message;
    }
}

最后在AppComponent中：
```
{{1}}
```

angular 2 - 显示任何异常的错误消息

1 个答案: