javascript matematica sul - Qual è lo scopo dell'uso della parentesi quadra in Angolare?




2 Answers

Permette di minimizzare il codice AngularJS. AngularJS utilizza i nomi dei parametri per iniettare i valori sulla funzione del controller. Nel processo di minimizzazione JavaScript, questi parametri vengono rinominati in stringhe più corte. Indicando quali parametri sono stati iniettati nella funzione con un array di stringhe, AngularJS può ancora iniettare i giusti valori quando i parametri vengono rinominati.

fare come

Vorrei capire la differenza tra la dichiarazione di MyOtherService e MyOtherComplexService . Soprattutto qual è lo scopo della parte a mensola quadrata? Quando usarli e quando no?

var myapp = angular.module('myapp', []);

myapp.factory('MyService', function($rootScope, $timeout) {
    return {
        foo: function() {
            return "MyService";
        }
    }
});

myapp.factory('MyOtherService', function($rootScope, $timeout, MyService) {
    return {
        foo: function() {
            return "MyOtherService";
        }
    }
});

myapp.factory('MyOtherComplexService', ['$rootScope', '$timeout', 'MyService', function($rootScope, $timeout, MyService) {
    return {
        foo: function() {
            return "MyOtherComplexService";
        }
    } 
}]);

myapp.controller('MyController', function($scope, MyOtherService, MyOtherComplexService) {

    $scope.x = MyOtherService.foo();
    $scope.y = MyOtherComplexService.foo(); 
});



Giusto per esemplificare ciò che è stato già detto, se si utilizza la seguente sintassi:

myapp.factory('MyService', function($scope, $http, MyService) { ... });

la maggior parte dei minifiers JS la cambieranno in:

myapp.factory('MyService', function(a, b, c) { ... });

poiché i nomi degli argomenti delle funzioni di solito possono essere rinominati per nomi più brevi. Questo interromperà il codice angolare.

In Angular, per rendere il tuo codice selezionabile in tutti i minifiers, usi la sintassi della parentesi:

myapp.factory('MyService', ['$scope', '$http', 'MyService', function($scope, $http, MyService) { ... }]);

che sarà ridotto a:

myapp.factory('MyService', ['$scope', '$http', 'MyService', function(a, b, c) { ... }]);

Nota che i minificatori non toccano le stringhe in modo che Angular vedrà il codice miniato e combaci gli argomenti in ordine:

$scope    = a
$http     = b
MyService = c

Per evitare questa brutta sintassi della parentesi quadra, dovresti usare miniserie intelligenti come ng-annotate .




Related