【问题标题】:CanActivate in Angular 2 return undefinedAngular 2 中的 CanActivate 返回未定义
【发布时间】:2017-12-20 14:54:11
【问题描述】:

我需要 canActivate 在 json 加载之前不要进一步跳过,为此我检查了 canActivate 是否未定义,它返回 false,但在控制台中它输出 canActivate 已通过并且值未定义。我做错了,不胜感激,谢谢。

我的http-data.service

import {Injectable} from '@angular/core';
import {Http} from '@angular/http';
import {Response} from '@angular/http';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from "@angular/router";

@Injectable()
export class HttpService implements CanActivate{
    constructor(private http: Http) {}

    dataModules = this.getDataModules();
    dataPresets = this.getDataPresets();
    dataModuleItems = this.getDataModuleItems();
    data: any[];

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) : Observable<boolean> | boolean {
            if (this.getDataModules !== undefined) {
                console.log('canActivate');
                console.log(this.getDataModules());
                return true;
            } else return false;
    }

    getDataOrganizations(): Observable<any[]>{
        return this.http.get('http://localhost:3010/data')
            .map((resp:Response)=>{
                let dataOrganizations = resp.json().organization;
                return dataOrganizations;
            });
    }

    loadDataModules(): Observable<any[]> {      
        return this.http.get('http://localhost:3010/data')
            .map((resp: Response)=> {
                let dataModules = resp.json().modules;
                return dataModules;
            });
    }

    loadDataPresets(): Observable<any[]> {      
        return this.http.get('http://localhost:3010/data')
            .map((resp: Response)=> {
                let dataPresets = resp.json().presets;
                return dataPresets;
            });
    }

    loadDataModuleItems(): Observable<any[]> {      
        return this.http.get('http://localhost:3010/data')
            .map((resp: Response)=> {
                let dataModuleItems = resp.json().module_items;
                return dataModuleItems;
            });
    }

    loadData() {
        return this.http.get('http://localhost:3010/data')
            .map((resp: Response)=> {
                let data = resp.json();
                return data;
            });
    }

    getDataModules(): any[] {
        this.loadDataModules().subscribe(((modules)=>{this.dataModules = modules; console.log('в http modules');console.log(this.dataModules);}));
        return this.dataModules;
    }


    getDataPresets(): any[] {
        this.loadDataPresets().subscribe(((presets)=>{this.dataPresets = presets; console.log(this.dataPresets);}));
        return this.dataPresets;
    }


    getDataModuleItems(): any[] {
        this.loadDataModuleItems().subscribe(((moduleItems)=>{this.dataModuleItems = moduleItems; console.log(this.dataModuleItems);}));
        return this.dataModuleItems;
    }
}

]2

【问题讨论】:

  • 在下面查看我的答案

标签: javascript angular typescript frameworks canactivate


【解决方案1】:

在您订阅响应之前,您的数据将是 undefined

 getDataOrganizations(): Observable<any[]>{
    let dataOrganizations :any[]
        return this.http.get('http://localhost:3010/data')
            .map(response => response.json().organization)
            .subscribe(data =>  {       
                dataOrganizations = data;
                return dataOrganizations; 
        });
    }

现在你会得到对象

【讨论】:

  • 需要map()吗?
  • 这对您有帮助还是需要更多帮助?
  • 谢谢。现在它发出一个订阅者对象。以及如何从中获取数据?
  • 请看我更新的代码。如果您有任何疑虑,请告诉我
猜你喜欢
  • 2017-01-08
  • 2019-07-28
  • 1970-01-01
  • 2018-04-02
  • 1970-01-01
  • 2016-04-29
  • 1970-01-01
  • 2017-07-14
相关资源
最近更新 更多