2012-07-29 23 views
6
angular.directive('ppd:reset', function(e1,e2) { 
    return function(linkElement) {  
     linkElement.wrap().... 
     }); 
    }; 
}); 

EDiversi tipi di angolare Direttive modelli

angular.directive('ppd:reset', [function() { 
     return function(scope, elm, attrs) { } 

}]); 

Qual è la differenza tra queste due direttive modello?

risposta

17

Se si dichiara vostre fabbriche con la notazione staffa, è possibile evitare problemi quando minifying il tuo codice:

angular.directive('ppd:reset', ["$compile", function(compile) { 
    return function(scope, elm, attrs) { } 

}]); 

L'iniettore guarda i nomi dei parametri delle funzioni, al fine di sapere cosa iniettare. Se un processo di minificazione lo rinomina, l'iniettore non sa più cosa fare. Ovviamente, il minification non toccherà i valori stringa, motivo per cui la notazione array funziona correttamente.

+2

È possibile trovarlo nella documentazione DI con il titolo "Annotazione in linea" http://docs.angularjs.org/guide/di#inlineannotation – Oliver

+0

Bene, è anche possibile utilizzare la sintassi meno dettagliata e la sorgente di analisi con ngMin :) https : //github.com/btford/ngmin –

4

La differenza è che la versione n. 1 è un modo semplice con cui l'angolare supporta le direttive di scrittura che non richiedono alcun modulo iniettabile. La versione # 2 è per avere iniettabili. Quindi, diciamo che la tua direttiva si basava sul servizio $ timeout, quindi avresti una definizione come sotto. Per me è più facile non pensare e basta usare la sintassi dell'array anche se non ci sono iniettabili.

angular.directive('ppd:reset', ['$timeout', function($timeout) { 
     return function(scope, elm, attrs) { } 
}]); 
+1

Angular fa ancora l'iniezione di dipendenza in entrambe le forme. La differenza sta nel trattare la minificazione come implica l'altra risposta. – markt

+0

Sono d'accordo con il commento di minification, tuttavia, il post originale era (come ho letto) per quanto riguarda l'avere un array contro non avere un array. Non avevo pensato di menzionare il bit di minificazione. Non vedo come la mia risposta sia sbagliata. –

+0

La tua risposta flat out dice che la prima sintassi è per scrivere direttive che non richiedono l'iniezione .. ma non è vero. Angular tenterà di iniettare dipendenze per entrambi. – markt

0

La differenza tra i due è che la notazione delle parentesi [] è minifier-safe poiché i minificatori non riducono le stringhe. Per esempio, se si tenta di Minimizza JavaScript senza di essa, si rivelerà:

angular.module('myApp', []) 
.controller('MainController', function($scope) { 
}); 

in

angular.module("myApp",[]).controller("MainController",function(e){}) 

Il problema in questo caso è che Angular non sa nulla di e al contrario di $scope, di cui è a conoscenza. Usando la notazione delle parentesi [], possiamo dire al $injector in anticipo cosa vogliamo che il controllore abbia accesso. Poiché i minificatori non (e non possono) ridimensionare le stringhe, è un modo sicuro per utilizzare la funzione di distribuzione delle dipendenze di Angular con o senza minifiers.

Per una comprensione più approfondita delle differenze di sintassi, è possibile consultare ng-book (https://www.ng-book.com/). Disclaimer, sono l'autore del libro e di http://www.ng-newsletter.com/.