Search code examples
javascriptc#.netangularjsngresource

Call custom method from web api using angularjs $resource


Here is my Web Api Action:

[RoutePrefix("api/CustomTemplate")]
public class CustomTemplateController : ApiController
{
    [HttpGet]
    [Route("GetCustomTemplate")]
    public IHttpActionResult GetCustomTemplate()
    {
         //Code 
    }
}

Here is my angularjs files:

service file:

'use strict';
app.factory('customService', ['$resource', 'ngAuthSettings', function ($resource, ngAuthSettings) {

var serviceBase = ngAuthSettings.apiServiceBaseUri;

return $resource(serviceBase + 'api/CustomTemplate/', {}, {
    query: { method: 'GET', isArray: true },
    getCustomTemplate: {
        url: 'GetCustomTemplate',
        method: 'GET',
        isArray: false
    }
});
}]);

my angularjs controller:

'use strict';
app.controller('customController', [
    '$scope', 'customService', function ($scope, customService) 
    {
        customService.getCustomTemplate({},function (customTemplate) 
        {
            $scope.customTemplate = customTemplate;
        });        
    }
]);

My problem is, I am unable to call GetCustomTemplate from angularjs. Please can someone tell me what I am doing wrong?


Solution

  • You must call full URL

    'use strict';
    app.factory('customService', ['$resource', 'ngAuthSettings', function ($resource, ngAuthSettings) {
    
    var serviceBase = ngAuthSettings.apiServiceBaseUri;
    
    return $resource(serviceBase + 'api/CustomTemplate/', {}, {
        query: { method: 'GET', isArray: true },
        getCustomTemplate: {
            url: serviceBase +'api/CustomTemplate/GetCustomTemplate', //full URL + custom action
            method: 'GET',
            isArray: false
        }
    });
    }]);