Angularjs $ ресурс множественный POST

У меня несколько Web Api Post methods:

    [HttpPost]
    public async Task<IHttpActionResult> Post([FromBody] AdModel adModel)
    {
        //Post
    }

    [HttpPost]
    [Route("AddToWatchList")]
    public async Task<IHttpActionResult> AddToWatchList(int adId)
    {
        // Post to database
    }

Вот мой сервер AngularJs:

app.factory('adService', ['$resource', 'ngAuthSettings', function ($resource, ngAuthSettings) {

      var serviceBase = ngAuthSettings.apiServiceBaseUri;

return $resource(serviceBase + 'api/Ads/', {}, {
            addToWatchList: {
            method: 'POST',
            url: serviceBase + 'api/Ads/addToWatchList'
           }
        }
    });
}]);

Контроллер AngularJs:

app.controller('listCategoryAdsController',
    ['ngAuthSettings', '$scope', 'adService', '$routeParams', '$location',
    function (ngAuthSettings, $scope, adService, $routeParams, $location) {

    $scope.addToWatchlist = function (adId) {
        adService.addToWatchList({ adId: adId }).$promise.then(
            function(result) {
                var path = $location.path();
                $location.path(path).search('nw', 1);
            },
            function (error) {

        });
    };

Мой Html, откуда я звоню:

<div class="col-sm-3 text-right price-box" data-ng-repeat="ad in Ads">
     <h2 class="item-price">
         $ {{ad.price}}
     </h2>
     <i class="fa fa-certificate">
     </i>
     <a ng-click="addToWatchlist(ad.adId)" class="btn btn-default  btn-sm make-favorite" tooltip="Click to add to watch list"
           tooltip-placement="left"
           tooltip-trigger="mouseenter">
          <i class="fa fa-heart"></i>
           <span>Watch list</span>
     </a>
</div>

Моя проблема Post([FromBody] AdModel adModel) вызывается отлично. Но когда я вызываю AddToWatchList(int adId) я получаю:

POST http://localhost: 8081/api/Ads/addToWatchList 404 (не найдено)