Question

I keep seeing different examples of creating controllers and services in AngularJS and I’m confused, can anyone explain to me the differences between the two approaches?

app.service('reverseService', function() {
    this.reverse = function(name) {
        return name.split("").reverse().join("");
    };
});

app.factory('reverseService', function() {
    return {
        reverse : function(name) {
            return name.split("").reverse().join("");
        }
    }
});

And also a controller example:

function ExampleCtrl($scope) {
    $scope.data = "some data";
}

app.controller("ExampleCtrl", function($scope) {
    $scope.data = "some data";
}

Answer 1

The first one will pollute the global namespace, which is not what you want in the long run.

function ExampleCtrl($scope){
    $scope.data = "some data";
}

The second one scopes the Controller to that module instance. It makes it also injectable. Better still is using the array notation (as below), since this will survive minification.

app.controller("ExampleCtrl", ['$scope', function($scope){
    $scope.data = "some data";
}]);

The difference between an (angular) service and factory seems quite small. A service wraps a factory, which uses $injector.instantiate to initialize the service.