How to call API in c# using angularjs

Question

Hi I am calling my API using below code

  $http.get('/api/controller/method?param=value').
           then(function (response) {
               if (response.status == 200) {
                   console.log(response.data);
               }
           });

It is working fine in my local machine (http://localhost/api/controller/method?param=value).

But when I deployed it in server with application name app, it is not able to call the API(http://server-ip/app/api/controller/method?param=value).

Obviously, it won't, as URL are different. So what is the correct way to call an API in c# so that it will work in any server.

What I have tried:
1. URL.Action : It is not working in this case.
2. I don't want to Use @HTML.hidden
3. Call starting with or without slash (/)

Answer 1

I usually solve this by using a factory like this -

First in the .cshtml page I load all the angular js required. Then create a factory for the baseURL like this -

function(angular){
    var module = angular.module('NameOfMyModule');  //gt the module
    module.factory('BaseUrl', function(){
         return '@Url.Action("Action", "Controller")';
    });
}(window.angular);

Then inject that BaseURL inside the controller -

....
module.controller('SomeController', [...., 'BaseUrl', function(...., BaseUrl){
     $scope.baseUrl = BaseUrl;

}]);

....`

Finally prepend it in the url

$http.get($scope.baseUrl + /...../).then(....);