Angular 2两个可观察者

时间:2018-01-27 00:36:56

标签: angular asynchronous observable angular2-observables

我有一个组件调用服务来通过HTTP获取一些数据。该服务虽然需要在API上“登录”,但如果之前没有。

所以当我从组件调用函数getFunnel()时,我希望这个函数检查是否有会话。如果没有会话,则func应该“登录”以获取令牌,然后运行预期的http以返回正确的observable。

import { Injectable } from '@angular/core';
import { DatePipe } from '@angular/common';
import { Observable } from 'rxjs/Observable';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable()
export class UserService {

    public url = "https://example.com";

    getFunnel(): Observable<any> {
        if(!localStorage.getItem("token")){
            this.getToken().subscribe(
                response => localStorage.setItem("token", response["token"]),
                err => console.log(err),
                () => {
                    return this.http.get(this.url+'/api/funnel', {
                        headers: {
                            'authorization': 'JWT '+localStorage.getItem("token")
                        }
                    });
                }
            );
        }
        else{
            return this.http.get(this.url+'/api/funnel', {
                headers: {
                    'authorization': 'JWT '+localStorage.getItem("token")
                }
            });
        }
    }

    private getToken(){   
        return this.http.post(this.url+'/api-token-auth/', 
            {"username": "xxxxx","password": "yyyyy"}
        ); 
    }

    constructor(private http: HttpClient) { }

}

如果不是令牌,则返回undefined。你是如何解决这种情况的?

感谢

编辑:

好的我知道我必须在这里使用switchMap或一些展平功能。但是怎么样?一个例子很棒。

谢谢!

1 个答案:

答案 0 :(得分:0)

您好,因为您没有订阅帖子,所以您将始终在您的案例中返回undefined。因此,请尝试阅读有关http post subscribe或map的信息,以便在返回之前等待并处理您的数据:) 示例https://www.metaltoad.com/blog/angular-2-using-http-service-write-data-api