HTTP 错误处理程序中的 Angular 2 router.navigate()

标签 angular angular2-routing

我正在尝试制作一个 Angular 系统,如果服务器返回 401 错误,它会导航到登录页面,我试过了,但它没有导航:

import { Injectable }     from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable }     from 'rxjs/Observable';
import { Router } from '@angular/router';

import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';

@Injectable()
export class AuthService {

  private heroesUrl = 'http://localhost:8000/auth/loggedIn';

  constructor (private http: Http, private router: Router) {}

  loggedIn (): Observable<string|number> {
    return this.http.get(this.heroesUrl)
      .map(res => { return res.json(); })
      .catch(this.handleError);
  }

  private handleError (error: Response|any) {
    if (error.status == 401) {
      this.router.navigate(['/path_to_login_page']);
      return error.status;
    }
  }
}

而且我已经检查了来自服务器的响应并且我还控制台记录了 error.status == 401,它确实返回了 true,任何人都可以帮助我解决这个问题。

提前致谢

最佳答案

Angular 提供了两个导航选项(Router Class):

根据提供的命令数组和起点进行导航。如果没有提供起始路线,则导航是绝对的。用法:

this.router.navigate(['team', 33, 'user', 11], {relativeTo: route});

根据提供的 url 进行导航。此导航始终是绝对的。用法:

this.router.navigateByUrl('/team/33/user/11');

如果您尝试使用第一个选项,请删除命令之前的 /:

this.router.navigate(['path_to_login_page']);

关于HTTP 错误处理程序中的 Angular 2 router.navigate(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41623892/

相关文章:

Angular 2+ 设置标准表单字段外观值

angular - 即使绑定(bind)有效,也无法读取未定义错误的属性

javascript - Angular2 location.back() 页面重新加载?

angular - 基于外部数据的动态路由

Angular 4 : no component factory found, 你把它添加到@NgModule.entryComponents了吗?

angular - 使用 ng 模型变量使用 Angular 2 的 ng 变化

node.js - 在 Angular2 中保护 API key

angular - this.router.navigate 代码的等效 [routerLink] 代码应该是什么?

hyperlink - 如何在 Angular 2 中创建指向外部 URL 的链接

javascript - Angular 2 - 带有路由器 socket 的测试组件