Get return values from http post method in Angular4 is not working Fine

Question

I have a requirement where I need to make a http post method request to a Web API that is save some data entered by the user. The Web API would return some values (TransationId) as a result and this result would be used for some other logic (For other function parameter etc...) Actually i saw several questions like this but they are not helping me.Because i am new in angular. please help me for resolving this its a big task for me

Http post method call is as follows:-

    CatchHeaderDetail(stock: any)
    : Observable<IHeaderstock[]> {
    let stockheaderdetail = stock;
    console.log(stockheaderdetail)
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });
    return this._http.post('http://localhost:3041/api/Stockcountheader/' + 'Stock', stockheaderdetail, options)
        .map((response: Response) => <IHeaderstock[]>response.json())
        .catch(this.handleError);

}

Angular4 component calls this service to save the data:

Onclick(){

        this.header = new IHeaderstock(this.userid, this.created, this.CompanyID, this.modified, this.modifieduserid, this.confirm, this.shopid);
    this.headeritems.push(this.header);


    this._enqService.CatchHeaderDetail(this.headeritems)
        .subscribe(value => {
            if (typeof value !== 'undefined' && value != null) {
                value.forEach(header => {
                    this.headeritems.push(this.header)
                });

            }
        },

            error => {
                console.error(error);
                this.statusMessage = "Problem with the service.Please try again after sometime";
            });

And MY API is

        [HttpPost]
    public IHttpActionResult Stock([FromBody] List<spGetNewStockCountHeader_Result> jsonvalues)
    {

        ObjectParameter TransactionId = new ObjectParameter("TransactionId", typeof(Int32));
        foreach (spGetNewStockCountHeader_Result Datastock in jsonvalues)
        {

            spGetNewStockCountHeader_Result Stockobject = new
            spGetNewStockCountHeader_Result();
            Stockobject.UserID = Datastock.UserID;
            Stockobject.created = Datastock.created;
            Stockobject.CompanyID = Datastock.CompanyID;
            Stockobject.modified = Datastock.modified;
            Stockobject.modifieduserid = Datastock.modifieduserid;
            Stockobject.confirm = Datastock.confirm;
            Stockobject.ShopId = Datastock.ShopId;

            enqentities.spGetNewStockCountHeader(Datastock.UserID,  Datastock.created, Datastock.CompanyID, Datastock.modified,
                Datastock.modifieduserid, Datastock.confirm,
            Datastock.ShopId, TransactionId).First();

        }

        return Ok(new { data = TransactionId.Value }); // i want this value to get in the angular4
    }

Answer 1

Change the code as shown below: map operator should map the data. Actual data is not a array. It is just value.

CatchHeaderDetail(stock: any): Observable<any> {
        let stockheaderdetail = stock;
        console.log(stockheaderdetail)
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });
        return this._http.post('http://localhost:3041/api/Stockcountheader/' + 'Stock', stockheaderdetail, options)
            .map((response: Response) => {
            return response.data;
            })
            .catch(this.handleError);

    }


Onclick(){
        this.header = new IHeaderstock(this.userid, this.created, this.CompanyID, this.modified, this.modifieduserid, this.confirm, this.shopid);
    this.headeritems.push(this.header);


    this._enqService.CatchHeaderDetail(this.headeritems)
        .subscribe(value => {
        if (value) {
            //use the value  for further process. Here value is integer value not an array.
        }
    },error => {
                console.error(error);
                this.statusMessage = "Problem with the service.Please try again after sometime";
            });

}