javascriptc#angularapiasp.net-core

How to receive the data sent from Angular to C# webapi?


I am sending form data to c# core web api via Angular. Console shows the data being sent via service to the api. I am trying to update a value. However, when debugger is kept at the web api controller, the data shows null. Here is the angular part:

this.commonService.updatescheduleFee(this.flatfeeModel).then((response: ResponseModel) => {
            this.toasterMessageService.showSuccess('Fee Schedule Updated Successfully!');
          });

Here is the update api being hit with the params:

async updatescheduleFee(params: any) {
    params['amount2'] = 100;
    console.log('FeeSchedule-params',params);
    
    return await this.ws.put(`${this.billingApiUrl}/invoice/FeeSchedule`,params).toPromise();
  }

Here is the api part where model shows null for the values sent via Angular:

[HttpPut("FeeSchedule")]
    public async Task<IActionResult> UpdateFeeSchedule(FeeScheduleRequest1Dto model)
    {
        try
        {
        }
    }

Here is the console screenshot where all the data that is sent to api can be seen: enter image description here

Any help would be more than appreciable.


Solution

  • I am trying to update a value. However, when debugger is kept at the web api controller, the data shows null

    I am completely agree with @Yong Shun because you are certainly lacking of FromBody as toPromise API send request with raw body as like .put(url, JSON.stringify(pocoModel); consequently it wouldn't be able to bind in stricky POCO class if you wouldn't define [FromBody]. So adding [FromBody] would resolve your issue.

    Demo Model:

    public class FeeScheduleRequest1Dto
        {
    
            public string Name { get; set; }
            public int Id { get; set; }
            public string Description { get; set; }
        }
    

    Controller:

        [HttpPut("FeeSchedule")]
        public async Task<IActionResult> UpdateFeeSchedule([FromBody] FeeScheduleRequest1Dto model)
        {
            try
            {
            }
        }
    

    Output:

    I have tested on my environment here is the exacpected result:

    enter image description here

    Note: Please have a look on the official document for angular service update method and asp.net core [FromBody] here.