Ionic 2 - 从服务中获取数据

时间:2016-11-22 10:40:56

标签: angular ionic-framework ionic2

情况

很抱歉,如果这是一个基本问题。

在我的Ionic 2应用程序中,我有登录的POST请求。它正常工作。有一个包含电子邮件和密码的表单。我将这些数据发送到API,并得到相应用户数据的响应。

唯一的问题是我在服务中获取了这些数据。

然后如何将此数据传递给loginPage组件?

在控制台中,我可以看到正确接收的所有数据。只是console.log在服务中。

我只需要将数据传递给组件。

代码

LoginPage组件

makeLogin() 
{
    var email = this.loginForm.value.email.trim();
    var password = this.loginForm.value.password.trim();

    this.userService.submitLogin(email, password, this.api_access_key);

}

服务

submitLogin(email: string, password: string, api_access_key: string) 
{       
    let urlSearchParams = new URLSearchParams();
    urlSearchParams.append('email', email);
    urlSearchParams.append('password', password);
    urlSearchParams.append('api_access_key', api_access_key);

    let body = urlSearchParams.toString()

    var headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');

    this.http
        .post(this.loginUrl, body, { headers: headers })
        .map(response => response.json())
        .subscribe(data => {
                    console.log('login API success');
                    console.log(data);
                }, error => {
                    console.log(error);
        });
}

1 个答案:

答案 0 :(得分:1)

您需要subscribecomponent而不是service

// component

makeLogin() 
{
    var email = this.loginForm.value.email.trim();
    var password = this.loginForm.value.password.trim();

    this.userService.submitLogin(email, password, this.api_access_key).subscribe((res) => {
      console.log(res);
    }, (error) => {
      console.log(error);
    });

}

//服务

submitLogin(email: string, password: string, api_access_key: string) 
{       
    let urlSearchParams = new URLSearchParams();
    urlSearchParams.append('email', email);
    urlSearchParams.append('password', password);
    urlSearchParams.append('api_access_key', api_access_key);

    let body = urlSearchParams.toString()

    var headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');

    return this.http
        .post(this.loginUrl, body, { headers: headers })
        .map(response => response.json());
}