ASP.NET MVC + Angular.js 1 HttpGet json object is null on server

Question

I'm aware this question has been asked before, I've looked at other answers but I cant seem to fix the problem. I keep receiving a null object server side when using $http.Get with angular js. Can anyone find what im missing or what i've done wrong?

My angular:

module.controller("albumReviewController", function ($http, $scope) {
    var albumID = $(".ui-albumID").find("input").val();
    $http(
    {
        method: 'Get',
        url: 'api/AlbumAPI/GetTotalAlbumRatings',
        data: { albumid: albumID }
        }).then(function successCallback(response) {
             $scope.totalRating = response.data;
        }), function errorCallback(response) {
             window.console.log(response);
        };
    };
 });

and my api controller:

[HttpGet("GetTotalAlbumRatings")]
[Route("api/AlbumAPI/GetTotalAlbumRatings/{model}")]
public JsonResult GetTotalAlbumRatings([FromBody]RatingAngularViewModel model)
    {
        // do stuff
    }

and the model:

public class RatingAngularViewModel
{
    public string AlbumID { get; set; }

    public RatingAngularViewModel()
    {
    }
}

I'm trying to send a get request to retrieve some values from the server but my model is always null.

that `Route` in the api controller looks suspicious to me. More interesting, however, is that you aren't using angular to retrieve your `albumID`, and you are passing `albumid` to your server but your model seems to expect `AlbumID`.... — Claies, Feb 03 '17 at 02:50
yeah ive been thinking that the Route in the api controller is wrong and might be the cause of this. i changed albumid to AlbumID but still null :( — lachlan.p.jordan, Feb 03 '17 at 02:58

score 0 · Accepted Answer · edited May 23 '17 at 10:29

i made the following changes and it worked.

in my controller (removed route attribute):

public JsonResult GetTotalAlbumRatings([FromUri]RatingAngularViewModel model)
    {
        // do stuff
    }

in angular:

module.controller("albumReviewController", function ($http, $scope) {
var albumID = $(".ui-albumID").find("input").val();
$http(
{
    method: 'Get',
    url: 'api/AlbumAPI/GetTotalAlbumRatings',
    params: { AlbumID: albumID }
    }).then(function successCallback(response) {
         $scope.totalRating = response.data;
    }), function errorCallback(response) {
         window.console.log(response);
    };
};

});

This was happening because i was using 'data' in the httpGet. See here: https://stackoverflow.com/a/13760360/2589445

ASP.NET MVC + Angular.js 1 HttpGet json object is null on server

1 Answers1