如何在 Angular 2 中显示我的视图之前解决一些东西/ajax 调用？答案

【问题标题】：How can resolve some stuff/ajax call before to display my view in Angular 2?如何在 Angular 2 中显示我的视图之前解决一些东西/ajax 调用？
【发布时间】：2016-11-24 16:19:11
【问题描述】：

我已经尝试过这个建议，但它不起作用 Observable 没有任何“fromPromise”方法，打字稿会报错。

import {Observable} from "rxjs/Rx";
import {Http} from "@angular/http";
import {GLOBAL_CONST} from "../global-const";
import {Resolve, ActivatedRouteSnapshot, RouterStateSnapshot} from "@angular/router";

export class ResolverSignupBegin{//} implements Resolve<any>{

    signupBeginData:any[];

    constructor(private http:Http){}

    getData(){
        return this.http.get(GLOBAL_CONST.apiPath + "/user/login/api-logged-in")
            .map(res => res.json())
            .subscribe(
                (data) => { console.log("data", data); return data; },
                (err) => { console.log("error", err); }
            );
    }


    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):Observable<any>{
        return this.getData();
    }


}

我在“this”.getData 上有一个错误，说“错误:(28, 16) TS2322: 'Subscription' 类型不可分配给 'Observable' 类型。 “订阅”类型中缺少属性“_isScalar”。 "

【问题讨论】：

标签： angular observable resolver

【解决方案1】：

如果您订阅，您会得到一个Subscription，但resolve 需要返回一个Observable。

与其订阅自己，不如返回一个 observable 并让 Angular 进行订阅

getData(){
    return this.http.get(GLOBAL_CONST.apiPath + "/user/login/api-logged-in")
        .map(res => res.json())
        .catch((err) => { console.log("error", err); throw err;}
        .do(
            (data) => { console.log("data", data)},
        );
}

不要忘记您需要导入 map 和 do 等运算符。见Angular 2 HTTP GET with TypeScript error http.get(...).map is not a function in [null]

【讨论】：