CODEWITHSUNDEEP
apirazortypescriptangular
Benjamin
Benjamin

Reputation: 353

Angular 2, typescript post to API model is null

I have downloaded the following project: http://www.asp.net/web-api/overview/security/individual-accounts-in-web-api. I run it on VS2015 and IIS express. The project is fine but i want to call the API with Angular 2.

So i have setup my project in Visual Studio Code and made a project in Angular 2 and TypeScript. When I try to post to the API method named Register, the values are null ?

My Visual Studio Code service(Angular2)

import { Injectable } from 'angular2/core';

import { Account } from '../account/Account';
import { RegisterBindingModel } from '../account/RegisterBindingModel';
import {Http, Response, Headers, RequestOptions} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import 'rxjs/Rx';

@Injectable()
export class AccountService {
    constructor(private _http: Http) {

    }
    
    createAccount(account: Account): Observable<string> {
        console.log('accountService.createAccount');
        let body = JSON.stringify({ account });
        console.log('T1' + body);
      
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });

return this._http.post('https://localhost:44305/api/Account/Register', body, options)
                    .map(this.extractData)
                    .catch(this.handleError);

Browser error and post values: BrowserError

Server API errors: Error1 Error2_In_API_Method Error2_In_API_Method

I can do a GET operation, but all my POST operations are NULL ?

Upvotes: 2

Views: 1207

Answers (1)

Benjamin
Benjamin

Reputation: 353

I found the following, not very effektiv, but working solution, where I map the account class objects to a new object. Then I stringify the new object and post it:

    createAccount(account: Account): Observable<string> {

        var obj = { Email: account.Email, Password: account.Password, ConfirmPassword: account.ConfirmPassword };

            let headers = new Headers({ 'Content-Type': 'application/json' });
            let options = new RequestOptions({ headers: headers });
            let body = JSON.stringify(obj);

            return this._http.post('https://localhost:44305/api/Account/Register',  body, options)
                                .map(this.extractData)
                                .catch(this.handleError);
}

For the first error I had on the API, i solved it by changing the following:

Request.GetOwinContext().GetUserManager<ApplicationUserManager>();

To

HttpContext.Current.GetOwinContext().GetUserManager<ApplicationUserManager>();

And then I could get the GetOwinContext() from the POST

Upvotes: 1

Related Questions