Question

我想收听 NavigationStart 事件并判断其url属性是否为/logout。如果是这样，当我的侦听器检测到正确 RoutesRecognized ， GuardsCheckStart ， ChildActivationStart 等。 > NavigationStart 事件。否则路由器应继续路由。

我不想使用某个组件，因为我无法显示任何/logout视图。

import { Component, OnInit } from '@angular/core';
import { Router, NavigationStart } from '@angular/router';


@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent implements OnInit {

  constructor(
    private router: Router,
  ) {
    router.events.filter(event => event instanceof NavigationStart).subscribe(
      (event: NavigationStart) => {
        if (event.url == '/logout') {
          this.logout();
          // TODO stop firing successive events
        }
      }
    );
  }

  ngOnInit() { }

  logout() {
    // TODO logout operations
  }

}

Answer 1

您可以使用路线保护。当路线匹配'注销'时，'YourGuard'将用于激活或不激活路线。如果守卫返回true，它将被重定向到'users / sign_in'（仅作为示例）。如果没有，在YourGuard内部，您可以重定向到其他路径或执行其他操作。

{ path: 'logout', canActivate: [ YourGuard ], redirectTo: 'users/sign_in' }

您无需“收听”路线事件。阅读有关警卫here的更多信息。

Answer 2

使用LoginComponent而不是redirectoTo：

  {
    path: 'logout',
    canActivate: [YourGuard],
    component: TheLoginComponent,
  }

现在，在 YourGuard 中，您可以从本地存储或类似的存储中删除用户...

没有组件的Angular2路由

2 个答案: