3

我正在尝试实现一个保护,以检查用户是否在访问视图之前保存了某些配置参数。配置表单和我要保护的视图都是分开的。

为此,我一直在尝试从服务(后端 API)获取配置参数,因此我能够检查所需的填充是否不为空,因此我可以在 canActivate 方法中返回 true 或 false,并使用路由器导航。

我尝试从 Guard 类的构造函数和 canActivate 方法获取响应,却发现甚至没有调用该服务。我也试过用 OnInit 实现这个类,但没有运气。

如何使 canActivate 方法在返回值 ture 或 false 之前等待 API 响应?

先感谢您!

快速编辑。我尝试了几件事,包括这些:

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

@Injectable()
export class ConfigurationGuard implements CanActivate{
  constructor(private service: Service) {}
  canActivate(){
    this.service.getConfigParameters().subscribe(parameters => {
      //if parameters are correct return true
      //else return false
    });
  }
}

也试过:

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

@Injectable()
export class ConfigurationGuard implements CanActivate{
  paramsCheck: boolean
  constructor(private service: Service) {
    this.service.getConfigParameters().subscribe(parameters => {
      //if parameters are correct paramsCheck=true
      //else paramsCheck=false
    });
  }
  canActivate(){
    if(paramsCheck){return true}
    return false
  }
}

并尝试使用 ngOnInit

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

@Injectable()
export class ConfigurationGuard implements CanActivate,OnInit {
  paramsCheck: boolean
  constructor(private service: Service) { }
  ngOnInit(){
    this.service.getConfigParameters().subscribe(parameters => {
      //if parameters are correct paramsCheck=true
      //else paramsCheck=false
    });
  }
  canActivate(){
    if(paramsCheck){return true}
    return false
  }
}

这些选项都不起作用。我还尝试了一个服务调用方法,它返回一个布尔值,让我知道它从服务获取的配置中的参数是否正确,但没有骰子。我猜验证必须在服务器端进行?

4

2 回答 2

0

您可以使用路由器解析,然后从服务中获取数据,并且在从服务中获取所有数据之前不会发生路由。请查看此链接以获取路由器解析的演示使用。

例如 - https://github.com/rahulrsingh09/footballdetails/blob/master/src/app/team/team.resolve.ts

请找到我对类似问题给出的答案的链接

获取组件中Angular2 Route中canActivate方法返回的值?

这是我使用路由器解析的仓库

于 2017-03-19T18:37:12.593 回答
0

如果您获取配置参数的服务返回一个observabledo

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

@Injectable()
export class CanActivateViaAuthGuard implements CanActivate {

  constructor(private service : Service) {}

  canActivate() {
    this.service.getConfigurationParameters().subscribe(
        parameters => {
            // if parameters are correct return true
            // else return false
        });
  }
}
于 2017-03-19T18:25:44.123 回答