AngularJS - разные способы создания контроллеров и сервисов, почему?

Я продолжаю видеть разные примеры создания контроллеров и сервисов в AngularJS, и я в замешательстве, может ли кто-нибудь объяснить мне различия между этими двумя подходами?

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("");
        }
    }
});

А также пример контроллера:

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

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

Ответы

Ответ 1

Первый будет загрязнять глобальное пространство имен , чего вы не хотите в конечном итоге.

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

Второй способ привязывает контроллер к экземпляру этого модуля. Это делает также инъекционным. Лучше все еще использовать нотацию массива (как показано ниже), так как это сохранится при минимизации.

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

Разница между сервисом (angular) и factory кажется довольно небольшой. Служба обертывает factory, который использует $injector.instantiate для инициализации службы.

Ответ 2

Мой предпочтительный способ создания контроллеров и директив выглядит следующим образом:

/**
* SomeCoolModule.controller.js
*/

(function(){
'use strict';

    angular.module('app.modals.SomeCoolModule').controller('SomeCoolModuleController', SomeCoolModuleController);

    AddFlowCurveModalController.$inject =
        [
            '$scope',
            '$filter',
            '$log',
        ];

    function SomeCoolModuleController($scope, $filter, $log) {
        /* controller body goes here */
    }
})();

PS: глобальное загрязнение пространства имен не происходит выше из-за IIFE.