我有这个全局错误处理程序:
import { ErrorHandler, Injectable, Injector } from '@angular/core';
import { Router } from '@angular/router';
@Injectable()
export class GlobalErrorHandler extends ErrorHandler
{
constructor(private injector: Injector) {
super(false);
}
handleError(error) {
super.handleError(error);
const router = this.injector.get(Router);
router.navigateByUrl('/error');
}
}
我把它放在app.module中:
providers: [
{
provide: ErrorHandler,
useClass: GlobalErrorHandler
}
]
测试这个我在服务中抛出一个错误。由于某种原因,错误组件与页面的其他内容一起显示 。像这样:
如果我通过转到/错误来测试错误组件,它会显示如下(错误页面是带有单行的段落):
Sorry, something went wrong!
但是当我转到错误应该触发的主页时,它会显示如下:
Sorry, something went wrong!
....
... Original content for /home
....
Sorry, something went wrong!
有人可以告诉我我做错了什么吗?
更新
我已经更新到angular-cli 1.5.2并且还更新到了角度5并且那里的bug似乎已经修复了。我可以使用路由器导航到错误页面。
答案 0 :(得分:4)
我做了一些研究,这就是为什么它的行为方式:
由于您在服务中出现错误,因此无法销毁使用服务的组件,因此路由器无法释放它。感谢@TetraDev的pointing this out。
虽然有人可能认为这是一个Angular错误我无法确认,因为我没有找到一个关于它的公开问题(如果你有链接,请随时更新答案)。
为了解决您的问题,我建议您不要在这种情况下使用Router
并执行浏览器重定向window.location.href = '/error';
。
答案 1 :(得分:-1)
这取决于您放置路由器插座的位置。如果你这样的话:
<router-outlet></router-outlet>
<!-- Home Component Content -->
它会像你说的那样加载其他组件的内容。要避免这种行为,您必须构建主要组件,如下所示:
<router-outlet></router-outle>
这就是你想要的所有页面中的内容,包括错误一。