角度保护服务注入服务答案

【问题标题】：angular guard-service inject service角度保护服务注入服务
【发布时间】：2018-07-15 10:54:31
【问题描述】：

我需要在警卫中注入服务。这个守卫检查用户是否被邀请，如果是，他可以访问路由。

要检查这种情况，我需要调用从数据库中获取此信息的服务。

我有一个循环依赖错误，我知道我们不应该在 Guards 中注入服务，但是在这种情况下，我需要这样做：

  providers: [AuthService, HackService, HacksStorageService, AuthGuard, EmailGuard],

还有守卫：

import { ActivatedRouteSnapshot, RouterStateSnapshot, CanActivate } from "../../../node_modules/@angular/router";
import { HacksStorageService } from "../shared/hacks-storage.service";

export class EmailGuard implements CanActivate {

  constructor(
    private hacksStorageService: HacksStorageService,
  ) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    this.hacksStorageService.fetchHack();
    // check if user was invited. should be in the participants array
    return true;
  }
}

我很困惑。通常我使用守卫来查看用户是否登录，所以我通常从 firebase 导入东西，而不是从我自己的服务中导入，所以不是循环依赖。

现在我想根据我自己的数据检查是否发生了某种情况。如果由于循环依赖而不允许我注入服务，我如何在 EmailGuard 中注入自己的数据？

谢谢。

【问题讨论】：

在EmailGurad中注入数据是什么意思？并在路由模块中提供您的AuthGuard，而不是应用程序或任何功能模块。
我想将 hacksStorageService 注入我的 EmailGuard。我需要那个，因为 hacksStorageService 有一个方法可以让我返回和反对。一旦我有了对象，我就可以检查一个条件
你可以向守卫注入服务，这没有问题，但是你不能有循环依赖，所以你必须以一种不会发生的方式解决它:)
非常抱歉，我忘记了@Injectable。当我看到我的守卫无法创建时，我立即想到了循环依赖。谢谢大家的帮助，再次抱歉。管理员，我应该删除问题吗？

标签： angular service guard

【解决方案1】：

您可以在警卫中注入服务。如果您的服务同步返回，那么您可以立即返回，就像在您的示例代码中一样。否则，我是这样做的（使用 firebase auth）

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
import { Observable, of } from 'rxjs';
import { map, first } from 'rxjs/operators';
import { AngularFireAuth } from '@angular/fire/auth';
import { Paths } from './paths';

@Injectable({
  providedIn: 'root'
})
export class SignInGuard implements CanActivate {

  constructor(private afAuth: AngularFireAuth, private router: Router) { }

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
      return this.afAuth.user.pipe(
        first(),
        map(user => {
          if (user) {
            this.router.navigate([Paths.MAIN_PATH]);
            return false;
          } else {
            return true;
          }
        })
      );
  }
}

【讨论】：