在订阅方法之外获取可变数据答案

【问题标题】：getting variable data outside subscribe method在订阅方法之外获取可变数据
【发布时间】：2018-09-19 20:47:05
【问题描述】：

我正在尝试为用户路由实现 canActivate，在此之前我想检查访问令牌是否仍然有效。因此我实现了这样的东西

export class AuthGuard implements CanActivate {
  data:Array<Object>;
  constructor(private base: BaseService){}

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {

    var session: any = { token: localStorage.getItem('abc') };   

    this.base.valid(session).subscribe(result => {
      this.data=result;
      console.log(this.data); <-- first 
    });

    console.log(this.data); <-- second
    return true;
  }
}

在这里，当我对它进行控制台操作时，我可以在 subscribe 方法中获取数据变量，但在此方法之外是给 undefined 值。如何在方法之外访问它。

【问题讨论】：

您缺少此关键字
在您致电console.log(this.data); 之前，您的订阅尚未完成。这就是你得到它的原因undefined
抱歉，您说的是第一个控制台还是第二个控制台日志。
Ashish，请检查我的回答。你能帮我理解你的逻辑，这样我就可以根据你的要求给你一些建议

标签： angular angular4-httpclient angular-guards

【解决方案1】：

那是不可能的。原因是，您正在尝试呈现一个值，该值的值会被 Observable 不断更改。

现在，当您尝试读取 outside console.log 时，您会得到未定义的值，因为该值尚未由 Observable streams 设置。当值发生变化时（假设在 1 秒后），outer console.log 已经被执行，所以你不会看到 this.data 的任何变化

要监控其值的变化，请将函数调用放在subscribe 块本身中。

更新 1

根据您的评论，您can refer this link

【讨论】：

好的，但是我怎样才能得到这个值，我想根据这个值返回布尔值。
基本上我是在调用 api 来检查访问令牌是否有效。服务器返回state，现在基于此状态，我尝试在 canActivate 方法中返回布尔值。在这里我调用基本 api，然后在订阅中我正在检查状态，以便我可以根据状态返回布尔值
@AshishJambhulkar：您可以将 validation 逻辑移至 BaseService，而不是检查 canActivate 中的状态，例如：validRouting()。现在这个validRouting() 可以从canActivate 服务本身返回（因为它可以返回Observable），它的类型是observable。我希望你明白我的意思。

【解决方案2】：

为了能够将数据推送到您定义的数组中，首先您必须将其初始化为一个空数组：

而不是：

data:Array<Object>

试试这个：

data: Array<any> = new Array<any>();

这是我用的，希望对你有帮助。

【讨论】：

【解决方案3】：

public new_data:any=[];
this.base.valid(session).subscribe(result => {
  this.data=result;
  for(let data of this.data) {
    this.new_data.push(id:data.id, name:data.name)
  }
    console.log(this.new_data); <-- first
});
 console.log(this.new_data); <-- Second

【讨论】：

您必须像上面那样使用 for 循环将订阅者结果存储在新数组中，并且您必须按照上面的代码将新数组声明为公共

【解决方案4】：

BaseService.valid 返回一个 Observable，它在 canActivate 方法返回后发出。

订阅块后的console.log首先执行，此时this.data仍未定义。

canActivate(
  next: ActivatedRouteSnapshot,
  state: RouterStateSnapshot): boolean {
  // 1.
  var session: any = { token: localStorage.getItem('abc') };   

  this.base.valid(session).subscribe(result => {
    // 3.
    this.data=result;
    console.log(this.data); 
  });


  // 2.
  console.log(this.data); 
  return true;
}

【讨论】：

抱歉打错字了，我已经添加了this关键字，但还是不行。
好的，但是我怎样才能得到这个值。