Question

我在Angular 2中有一个页面和一个服务。

当我调用服务函数this.Auth.login()时，它会发出一个http post请求。我的问题是，一旦请求返回数据，我想在服务和页面中使用该数据。

我尝试了各种各样的东西，但无法弄清楚如何去做。

我知道我的代码不能像这样工作，因为现在this.Auth.login()会返回一个订阅者对象。如果我删除了服务中的'.subscribe（）'，它将在Page中运行。但这不是我需要的。

我也试图回复一个承诺，但也无法使其发挥作用。

有人知道如何在两个控制器中获得http.post的数据并在请求完成后立即使用它吗？

这是我的代码

页：

import {AuthService} from '../auth/auth.service';

@Page({
    templateUrl: 'build/pages/signin/signin.html'
})
export class Signin {

    constructor(app: IonicApp, auth: AuthService){
        this.Auth = auth;
    }

    signIn = function() {
        this.Auth.login(this.user.email, this.user.password)
            .subscribe(data => {do some stuff here});
         // maybe a promise with .then can solve this
    };
}

服务：

import {Http, Headers} from 'angular2/http';
import {Injectable} from 'angular2/core';

@Injectable()
export class AuthService {
    private http;

    constructor(http:Http) {
        this.http = http;
    }

    login(email, password) {
        let headers = new Headers();
        headers.append('Content-Type', 'application/json');

        // maybe i need to return this as a promise
        return this.http.post('http://localhost:9000/auth/local', JSON.stringify({
                    email: email,
                    password: password
                }), {
                    headers: headers
                })
                .subscribe(data => {
                    do some stuff here too with the data
                ));
                // i tried to add .toPromise() but that didn't work
    }
}

我省略了其他代码行，因此可能会遗漏一些依赖项。这一切都很好。

Answer 1

您可以在map Service的正文中使用login。即

.map(data => {
                do some stuff here too with the data
                // still bubble up
                return data;
            ));

Answer 2

好的，我不知道这是否合法，但似乎对我有用：

var res = this.http.post('http://localhost:9000/auth/local', JSON.stringify({
        email: email,
        password: password
    }), {
        headers: headers
    });

res.subscribe(
    data => {
        console.log('data');
    },
    err => {
        console.log('err');
    },
    () => {  
        console.log('next');
    }
);

return res;

Angular 2 http很多订阅者

2 个答案: