Angular Base Url Factory

Changes to the URLs and the structure of an MVC app are common and expected when you work on a new product.

however the cost of making these changes can expand greatly depending on how entangled your application's code is.

If one of these changes involves updating the base url used by your ajax calls, then you will have to go through every javascript or html file and update each instance individually.

using AngularJs factories, you cant get an instance of the base url on page load and use it in a function which takes an string for example the name of an Action in a controller and preappends this base url to the action's name.

angular.module('AngularApp').factory('urlFactory', function () {
    return {
        format: function (url) {
            return '@string.Format("{0}://{1}{2}home/", Request.Url.Scheme, Request.Url.Authority, Url.Content("~"))' + url;
        }
    }
});

and in your ajax calls you only need to pass in the action name that is being called.

$http.post(urlFactory.format('credits'), { token: $scope.cd.Token, Id: $scope.cd.Id }).
success(function (data, status, headers, config) {

    $scope.result = data;
    $scope.running = false;

}).
error(function (data, status, headers, config) {

    $scope.result = data;
    $scope.running = false;

});