Angular 2 - web api：不在 api 获取发布的数据答案

【问题标题】：Angular 2 - web api : not get the posted data at apiAngular 2 - web api：不在 api 获取发布的数据
【发布时间】：2017-09-29 12:51:08
【问题描述】：

从我发送数据的页面：

     register() {
        this.loading = true;
        this.Register = { firstName: 'aa', lastName: 'aa', email: 'aa', password: 'aa', cpassword: 'aa', gender: "male", dob: '2017-05-02' };
        this.userService.create(this.Register)
            .subscribe(
            data => {
                alert("aa");
            },
            error => {
                // this.alertService.error(error);
                this.loading = false;
            });
    }

我从 Angular 2 服务代码中发布了我的数据如下：

    create(UserRegister: UserRegister) {  
       return this.http.post('http://localhost:53625/api/UserLoginAPI/InsertUser', UserRegister, this.jwt()).map((response: Response) => response.json());
    }

    private jwt() {   
            let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'  });
            return new RequestOptions({ headers: headers });
    }

为此我在api中编写代码如下：

       [HttpPost]
        public IHttpActionResult InsertUser(UserRegisterModel UserRegister)
        {
            int returnval = 0;
            returnval = objUserLoginBAL.InsertUser(objUserRegisterModel);
            return Json(returnval);
        }

我在 api 端接到电话，但我的对象没有得到任何价值。如图所示：

【问题讨论】：

标签： post asp.net-web-api angular2-forms angular2-services

【解决方案1】：

您的初始页面应如下所示：注意我删除了 cpassword，因为它不在您的 API 模型中

register() {
  this.loading = true;

  this.Register = { 
    dob: '2017-05-02' 
    email: 'aa', 
    firstName: 'aa', 
    gender: "male",
    lastName: 'aa', 
    password: 'aa',  
  };

  this.userService.create(this.Register)
    .subscribe((data:any) => {
        alert("aa");
    },(error:any) => {
        // this.alertService.error(error);
        this.loading = false;
    });
}

您的服务：我清理了jwt() 函数。

import { Http, Response, Headers, RequestOptionsArgs} from '@angular/http';

create(userRegister: UserRegister) {  
  let url:string = 'http://localhost:53625/api/UserLoginAPI/InsertUser';

  return this.http.post(url, userRegister, this.jwt())
    .map((res:Response) => res.json());
}

private jwt():RequestOptionsArgs {   
  let headers:Headers = new headers();

  headers.append('Content-Type', 'application/json');

  let options:RequestOptionsArgs = new RequestOptions();

  options.headers = headers;

  return options;
}

【讨论】：

【解决方案2】：

试试下面：

 create(UserRegister: UserRegister) {  
   return this.http.post('http://localhost:53625/api/UserLoginAPI/InsertUser', UserRegister, this.jwt(UserRegister)).map((response: Response) => response.json());
}

private jwt(UserRegister: UserRegister) {   
let _body = JSON.stringify(UserRegister);
let headers = new Headers({ 'Content-Type': 'application/json;charset=utf-8' });

return new RequestOptions({ 
          headers: headers,
          body: _body });
}

【讨论】：

您能否分享您的代码 sn-p 以了解如何使用值调用 create 方法？
您可以尝试在请求头的请求选项中添加正文对象并尝试吗？
看不懂请举个例子
我收到错误，例如 requestOptions 的争论是不可分配的字符串参数类型 |请求
已经以你的例子更新了我的答案，试一试。

【解决方案3】：

我认为问题在于您的标题结构。尝试改变这个：

'Content-Type': 'application/x-www-form-urlencoded'

到这里：

'Content-Type': 'application/json'

同时在 UserRegisterModel 中为 cpassword 引入一个字段。

【讨论】：