HTTP POST from Angular2 to WebApi

Question

I am trying a http post request using HTTP service in angular 2. But the parameters are not going on web api action. Below are my components and services:
My component where service is injected(LogService)

    import {Component, Inject} from '@angular/core';
    import {Http, HTTP_BINDINGS} from '@angular/http';
    import {Observable} from 'rxjs/Rx';
   import {LogService} from '../../services/canvas/logService'
   import {PagingModel} from '../../PagingModel';
   @Component({
   selector: 'about',
   templateUrl: 'app/components/about/about.html',
   styleUrls: ['app/components/about/about.css'],
   bindings: [LogService, HTTP_BINDINGS],
   providers: [],
   directives: [],
   pipes: []
   })

   export class About {
        private abc = "";
      constructor( @Inject(LogService) public _logService: LogService) {
       this._logService = _logService;
   }

    ngOnInit() {
    this.getAllLogs();

     }
    getAllLogs() {
    var body = { CurrentPageIndex: 1, PageSize: 10,SearchText:"JHFGHY"};
    let mod = new PagingModel();
     mod.CurrentPageIndex = 1;
     mod.PageSize = 10;
     mod.SearchText = "sdfs";
     this._logService.getAllLogs(mod).subscribe(function (data) {

        var abc = data.json();
    });


  }
 }

Service (LogService) from where data is posted to web api post

import { Injectable } from '@angular/core';
 import { Http, Response, Headers, RequestOptions} from '@angular/http';
 import {Observable} from 'rxjs/Observable';
 import 'rxjs/add/operator/map';
 import {About} from '../../components/about/about';
 require('rxjs/add/operator/toPromise');


 @Injectable()
 export class LogService {
 public headers: Headers;

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

 }
  getAllLogs(model): Observable<Response> {

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

    return this.http.post("http://localhost:64224/api/Logs/Paging",JSON.stringify(model), options);

   }


 }

And my web api controller action is:

    [HttpPost]

    [Route("Paging")]
    public ResponseMessage Paging([FromBody] PagingModel model)
     {
        ResponseMessage responseMessage = new ResponseMessage();
        List<ActivityLogModel> activityLogModelList = new List<ActivityLogModel>();
        activityLogModelList = logService.Paging(model);
        responseMessage.totalRecords = activityLogModelList.Count();
        activityLogModelList = activityLogModelList.OrderBy(x => x.UserId).Skip((model.CurrentPageIndex - 1) * model.PageSize).Take(model.PageSize).ToList();
        responseMessage.data = activityLogModelList;
        return responseMessage;
    }
    #endregion

I am not able to get the parameters sended from LogService http post method in this Web Api controller. Please help me out here. Thank you in advance

Answer 1

getAllLogs should be

getAllLogs() {
  var body = { CurrentPageIndex: 1, PageSize: 10,SearchText:"JHFGHY"};
  let mod = new PagingModel();
  mod.CurrentPageIndex = 1;
  mod.PageSize = 10;
  mod.SearchText = "sdfs";
  this._logService.getAllLogs(mod).subscribe(data => { // <<<=== use arrow function instead of `function`
    this.abc = data.json(); // <<<=== this.abc
  });
}