Angular2发布请求没有向服务器发送正确的数据

时间:2016-04-28 11:29:39

标签: javascript typescript angular

当我在控制台上记录;时,我正在获取表单的字段并将其传递给服务this.form.value当我发送相同的内容时,我正在this.form.value到服务并调用服务器,如:

Object { email: "zxzx", password: "zxzxx" }

正在调用服务器,但未传递值。当我在控制台上记录响应时,我得到了:

import {Http} from 'angular2/http'; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/toPromise'; import {Injectable} from 'angular2/core' import {Post} from './post'; import {Observable} from 'rxjs/Observable'; @Injectable() export class PostService { //dependency injection private _url = "http://127.0.0.1/accounts/login_user/"; constructor(private _http:Http) { } createPost(post){ return this._http.post(this._url,JSON.stringify(post)) .map(res=>res.json()); } }

有人可以帮我解决这个问题吗?

谢谢。

2 个答案:

答案 0 :(得分:2)

你需要subscribe()否则观察者不会做任何事情:

createPost(post){
  return this._http.post(this._url,JSON.stringify(post))
    .map(res=>res.json())
    .do(val => console.log(val));
}

...
this.createPost(...).subscribe(data => console.log(data));

答案 1 :(得分:2)

您的console.log打印与您的请求相对应的observable,但不打印其结果。如果要打印此结果,可以使用do运算符:

createPost(post){
  return this._http.post(this._url,JSON.stringify(post))
    .map(res=>res.json())
    .do(data => {
      console.log(data);
    });
}

您说请求已执行。如果你订阅了observable就是这种情况:

this.service.createPost(...).subscribe(() => {
  (...)
});

修改

您还需要设置Content-Type标题:

createPost(post){
  var headers = new Headers();
  headers.append('Content-Type', 'application/json');
  return this._http.post(this._url,JSON.stringify(post), { headers })
    .map(res=>res.json())
    .do(data => {
      console.log(data);
    });
}

<强> EDIT2

如果您想发送经过网址编码的表单:

您还需要设置Content-Type标题:

createPost(post){
  var headers = new Headers();
  headers.append('Content-Type', 'application/x-www-form-urlencoded');

  let content = new URLSearchParams();
  content.set('prop', post.prop);
  (...)

  return this._http.post(this._url, content.toString(), { headers })
    .map(res=>res.json())
    .do(data => {
      console.log(data);
    });
}