Понимание canactivate и маршрутов в угловых 2

Я пытаюсь проверить, авторизован ли пользователь, а если нет, направить его / ее на страницу входа. Я действительно сумел сделать это, но мне трудно, как работает механизм. пожалуйста, смотрите ниже код.

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    let fus: FakeUserService  = new FakeUserService();
    if(!fus.authorization()){
      this.router.navigate(['login']);
      return false; // Code works even this line is commented out. The user is redirected to the login page.
    }
    return true;
  }

Дело в том, что я не понимаю, как работает router.navigate в этом сценарии. Идет ли пользователь на нужную страницу и возвращается к входу в систему, когда я закомментирую "return false"? Или функция router.navigate переопределяет все команды маршрутизации? Я немного растерялся..

1 ответ

import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router} from "@angular/router";
import {Injectable} from "@angular/core";
import {Observable} from "rxjs";

@Injectable()
export class AuthGuard implements CanActivate{


  constructor(protected router: Router)
  {

  }

    canActivate(route: ActivatedRouteSnapshot,
                state: RouterStateSnapshot):Observable<boolean> | boolean{
      console.log("In Can Activate AuthGuard");
      if(route.params['key'] == "X"){
        return true;
      }
      this.router.navigate(['/home',{message:"Not Authorised"}]);
      return false;
    }
}

маршрут

  { path: 'guardcheck', component:  CheckComponent , canActivate: [AuthGuard]},

В приведенном выше примере мы возвращаем true, когда мы хотим, чтобы пользователь продолжил с маршрутом, на котором размещена защита, и если нет, мы переходим на страницу ошибок с помощью роутера navigate и возвращаем false .

Это ложное возвращение предназначено для охранника, чтобы узнать, что условие не выполнено.

Рабочий пример

Другие вопросы по тегам