AngularJS - diversi modi per creare controller e servizi, perché?

Question

Continuo a vedere diversi esempi di creazione di controller e servizi in AngularJS e sono confuso, qualcuno può spiegarmi le differenze tra i due approcci?

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

E anche un esempio di controllo:

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

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

Answer 1

Il primo sarà inquinano l'global namespace, che non è quello che vuoi nel lungo periodo.

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

Il secondo circoscrive il Controller all'istanza di quel modulo. Lo rende anche injectable. Meglio ancora sta usando la notazione dell'array (come sotto), poiché questo sopravviverà alla minificazione.

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

La differenza tra un servizio (angolare) e la fabbrica sembra piuttosto piccola. Un servizio esegue il wrapping di una factory, che utilizza $injector.instantiate per inizializzare il servizio.

Answer 2

Il mio modo preferito di creazione di regolatori e delle direttive è la seguente:

/** 
* 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: nessun inquinamento namespace globale sta avvenendo sopra a causa di IIFE.