Angular 2 может активировать с обещанием ударить удаленный сервис

Question

Во-первых, я не уверен, что это лучший способ справиться с этой проблемой, но я ищу маршрутную охрану на "/", которая проверяет, вошел ли пользователь в систему, если да, чтобы перенаправить его на "/dashboard", Я хотел бы сделать это до загрузки маршрута, чтобы избежать мигания экрана, так как проверял статус авторизации на удаленном сервере.

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

Вот код

import { Injectable }               from '@angular/core';
import { Router, CanActivate }      from '@angular/router';

import { Observable }               from 'rxjs/Observable';

import { User }                     from './../../models/user.model';
import { AuthService }              from './auth.service';

@Injectable()
export class HomeAuthGuard implements CanActivate {
  constructor(
    private router: Router,
    private authService: AuthService
  ) {}

  canActivate(): Promise<boolean> {
    return new Promise((resolve) => {
      this.authService.getStatus()
        .then(function (user: User) {
          console.log('home auth', user)
          this.router.navigate(['/dashboard']);
          resolve(false);
        })
        .catch(function () {
          resolve(true);
        });
      });
  }
}

Answer 1

Это происходит из-за "этого" связывания. Скорее всего, ваш код переходит к блоку catch после console.log из-за того, что this не является экземпляром класса компонента. Используйте "жирную стрелку", чтобы решить эту проблему. лайк:

return new Promise((resolve) => {
  this.authService.getStatus()
    .then((user: User) => {
      console.log('home auth', user)
      this.router.navigate(['/dashboard']);
      resolve(false);
    })
    .catch(err => {
      resolve(true);
    });
  })