Hi all,

I have utilized the Umbraco WebApi and the dashboard functionality to create an interface to our system allowing the user to update content within Umbraco using an external web service. The main problem I have though is when I click the button to run the getRegions() update method, it is running the getAll() updates method despite the html code clearly showing that I have an ng-Click of getRegions set on the button I am clicking.

HTML

<div ng-controller="AxumTailorMade" class="container-fluid">
    <div class="row">
        <div class="col-md-12 heading clearfix">
            <h3>Axum Integration</h3>
            <img class="pull-right" src="/App_Plugins/Axum/css/images/logo.png" />
        </div>
    </div>
    <div class="row">
        <div class="info-window">
            <p ng-repeat="item in info track by $index">{{item}}</p>
            <p ng-repeat="(key, value) in link"><a target="_blank" href="/umbraco/#/content/content/edit/{{key}}">{{value}}</a></p>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update All Content</h4>
            <p>Synchronise all content changes that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-disabled="loadAll" ng-click="getAll()">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadAll" /></span>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update Regions</h4>
            <p>Synchronise all changes to regions that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getRegions()" ng-disabled="loadRegions || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadRegions" /></span>
        </div>
        <div class="col-md-3 update-type end">
            <h4>Update Countries</h4>
            <p>Synchronise all changes to country that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getCountries()" ng-disabled="loadCountries || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadCountries" /></span>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update Areas</h4>
            <p>Synchronise all changes to areas that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getAreas()" ng-disabled="loadAreas || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadAreas" /></span>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update Cities</h4>
            <p>Synchronise all changes to cities that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getCities()" ng-disabled="loadCities || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadCities" /></span>
        </div>
        <div class="col-md-3 update-type end">
            <h4>Update Categories</h4>
            <p>Synchronise all changes to categories that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getCategories()" ng-disabled="loadCategories || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadCategories" /></span>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update Packages</h4>
            <p>Synchronise all changes to packages that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getPackages()" ng-disabled="loadPackages || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadPackages" /></span>
        </div>
        <div class="col-md-3 update-type">
            <h4>Update Hotels</h4>
            <p>Synchronise all changes to hotels that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getHotels()" ng-disabled="loadHotels || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadHotels" /></span>
        </div>
        <div class="col-md-3 update-type end">
            <h4>Update Activities</h4>
            <p>Synchronise all changes to activities that have occured in the past 24 hours.</p>
            <span><button class="button button-axum" type="button" ng-click="getActivities()" ng-disabled="loadActivities || loadAll">Update</button><img src="/App_Plugins/Axum/css/images/loader.gif" ng-show="loadActivities" /></span>
        </div>
    </div>
</div>

axumtailormade.service.js

angular.module("umbraco.services").factory("AxumTailorMade", function ($http) {
    return {
        getAll: function () {
            return $http.get("/umbraco/api/axumtailormade/getallupdates");
        },
        getRegions: function () {
            return $http.get("/umbraco/api/axumtailormade/getregions");
        },
        getCountries: function () {
            return $http.get("/umbraco/api/axumtailormade/getcountries");
        },
        getAreas: function () {
            return $http.get("/umbraco/api/axumtailormade/getareas");
        },
        getCities: function () {
            return $http.get("/umbraco/api/axumtailormade/getcities");
        },
        getCategories: function () {
            return $http.get("/umbraco/api/axumtailormade/getcategories");
        },
        getPackages: function () {
            return $http.get("/umbraco/api/axumtailormade/getpackages");
        },
        getHotels: function () {
            return $http.get("/umbraco/api/axumtailormade/gethotels");
        },
        getActivities: function () {
            return $http.get("/umbraco/api/axumtailormade/getactivities");
        }
    };
})

axumtailormade.controller.js

angular.module("umbraco")
    .controller("AxumTailorMade",
    function ($scope, $http, $filter, AxumTailorMade, notificationsService) {
        $scope.info = [];
        $scope.getAll = function() {
            $scope.loadAll = true;
            $scope.link = null;
            getMessage("Retreiving all updates");
            AxumTailorMade.getAll().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadAll = false;
            });
        };

        $scope.getRegions = function() {
            $scope.loadRegions = true;
            $scope.link = null;
            getMessage("Retreiving 'Region' updates");
            AxumTailorMade.getAll().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadRegions = false;
            });
        };

        $scope.getCountries = function() {
            $scope.loadCountries = true;
            $scope.link = null;
            getMessage("Retreiving 'Country' updates");
            AxumTailorMade.getCountries().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadCountries = false;
            });
        };

        $scope.getAreas = function() {
            $scope.loadAreas = true;
            $scope.link = null;
            getMessage("Retreiving 'Area' updates");
            AxumTailorMade.getAreas().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadAreas = false;
            });
        };

        $scope.getCities = function() {
            $scope.loadCities = true;
            $scope.link = null;
            getMessage("Retreiving 'City' updates");
            AxumTailorMade.getCities().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadCities = false;
            });
        };

        $scope.getCategories = function() {
            $scope.loadCategories = true;
            $scope.link = null;
            getMessage("Retreiving 'Category' updates");
            AxumTailorMade.getCategories().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadCategories = false;
            });
        };

        $scope.getPackages = function() {
            $scope.loadPackages = true;
            $scope.link = null;
            getMessage("Retreiving 'Package' updates");
            AxumTailorMade.getPackages().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadPackages = false;
            });
        };

        $scope.getHotels = function() {
            $scope.loadHotels = true;
            $scope.link = null;
            getMessage("Retreiving 'Hotel' updates");
            AxumTailorMade.getHotels().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadHotels = false;
            });
        };

        $scope.getActivities = function() {
            $scope.loadActivities = true;
            $scope.link = null;
            getMessage("Retreiving 'Activity' updates");
            AxumTailorMade.getActivities().success(function (data) {
                if (!data.Result) {
                    getMessage(data.Message);
                    notificationsService.error("Error", data.Message);
                } else if (data.Result) {
                    getMessage(data.Message);
                    $scope.link = data.Updates;
                    notificationsService.success("Success", data.Message);
                }
                $scope.loadActivities = false;
            });
        };

        function getMessage(message) {
            var today = $filter("date")(new Date(), "dd/MM/yyyy, HH:mm:ss");
            $scope.info.push(today + " - " + message);
        }
    });

Does anybody know why this might be happening? It's really stupid and Firebug clearly shows that the HTML output contains the correct method but when the button is click the 'Net' panel shows that the getAll() method is being run.

Any help would be greatly appreciated.