Map AngularJs QueryString with Web Api Controller Parameter

Question

Here is my Angularjs Controller Code:

app.controller('listAdsController', ['$scope', 'myService', '$routeParams', '$location', function ($scope, myService, $routeParams, $location) {

myService.getAdsByCategory({categoryId : $routeParams.categoryId});
$scope.totalItems = 64;

$scope.pageChanged = function () {        
    var path = $location.path();
    $location.path(path).search('page', $scope.currentPage);
};

$scope.maxSize = 10;
$scope.bigTotalItems = 175;
$scope.currentPage= 1;
$scope.itemsPerPage = 50;
}]);

Here in pageChangedfunction, I am trying to change my Url according to page number by using querystring like below:

//localhost/category/property/4/house-for-rent?page=2

Here is my routing config for that Url:

$routeProvider.when("/category/:category/:categoryId/:urlName", {
        controller: "listAdsController",
        templateUrl: "app/views/category-ads.html"
    });

Now below is my Web Api 2 Controller:

    [HttpGet]
    public IHttpActionResult GetAllByCategory([FromUri] int categoryId, int? page = null)
    {
       //Code
    }

The problem is, page parameter is always always null no matter what I am passing in it. Can you someone guide me what I am missing here?

Answer 1

The problem was very small. I was just passing the querystring to url but was not getting it from the routeParam.

The solution is:

$scope.categoryAds = jetService.getAllByCategory({ categoryId: $routeParams.categoryId, page: $routeParams.page });

You need to get page from the querystring pass it to your service.