2015-05-06 2 views
26

Entschuldigung, wenn diese Frage zu offensichtlich klingt.Grund für die Verwendung der Array-Notation bei der Definition von AngularJS Controller

Ich habe vor kurzem angefangen zu erforschen und zu lernen AngularJS.

.. und es gibt ein paar andere, dass ich je gesehen habe - ich habe durch einige gute Tutorials gegangen.

Ich sage nicht, dass ich alle Dokumente gelesen/studiert habe.

Frage beginnt hier -

nun auf die Frage kommt, sehe ich, dass die Definition eines Controllers in einem Ort verschieden ist, und es ist anders in einer anderen -

Eine Definition verwendet eine Art von Array-Notation (nicht sicher, ob der offiziellen Bezeichnung) zur Injektion:

app.controller("MyCtrl", ['$scope', function($scope){ 
    $scope.someData = "Array notation"; 
}]); 

Und es ist die, ohne Array:

Nicht sagen, das ist das einzige, was ich versuche zu verstehen, aber ja, ich würde auf jeden Fall lieben, den Unterschied zu verstehen.

Gibt es einen großen Unterschied zwischen den beiden?

Vielen Dank.

Hinweis: Ich habe nach ähnlichen Fragen in SO gesucht, konnte aber nicht finden, wonach ich gesucht habe. Es tut uns leid.

Antwort

22

Der Unterschied besteht darin, dass bei Minimierung der Sekunde der Parametername minimiert wird und angular nicht mehr in der Lage ist, die Argumente zu untersuchen, um herauszufinden, welche Abhängigkeiten injiziert werden sollen. Die Array-Syntax mit der Abhängigkeit in einer Zeichenfolge bedeutet, dass es sich um eine Minimierungssicherheit handelt.

Es gibt eine Bibliothek namens ng-annotate, die das zweite Beispiel in das erste Beispiel ändert, so dass der Code wieder minifikationssicher ist.

+0

mehr lernen können, also andere als minification gibt es keine weiteren Unterschiede? Falls ich ohne Verkleinerung gehe, kann ich beides verwenden. – Yellen

+1

@Seram das ist richtig, es ist rein, um Ihren Code zu schützen, wenn seine –

+0

@Seram korrekt ist. Sie können jedoch immer noch Minification durchführen, solange Sie Ihren Code zuerst über ng-annotieren. –

1

Es gibt einen Unterschied, wenn es um Minification geht. Wenn Sie Ihre Datei minimieren, wie Sie es möglicherweise tun, um die Leistung zu erhöhen, können Probleme auftreten, wenn Sie die zweite Option verwenden.

Da Angular die Abhängigkeiten des Controllers von den Namen der Argumente zur Konstruktorfunktion des Controllers ableitet, würden alle Funktionsargumente ebenfalls verkleinert, wenn Sie den JavaScript-Code für den Controller minimieren würden, und der Dependency Injector würde dies nicht tun in der Lage sein, Dienste richtig zu identifizieren.

Also im Grunde sind Sie besser dran mit der ersten Option, kleinen bisschen mehr Typisierung beteiligt, aber es ist sicherer und wird nicht brechen, wenn Sie Ihren Code minify :-)

This ist ein recht kurzes Tutorial aber erklärt es schön .

6

Es gibt nicht viel Unterschied zwischen den beiden Ansätzen. Beide Codes funktionieren auf die gleiche Weise. Aber wenn Sie den zweiten Code verwenden, wird es Sie verwirren, nachdem Sie Ihren Code minimieren.

Geben Sie für ein Beispiel: -

app.controller("MyCtrl", function(a){ ... });//$scope is changed to a 

und Ihr Code wird nicht funktionieren, wie AngularJS Code $ scope Variable verwendet, da es nicht zuerst nehmen, zweite, dritte und so weiter Parameter.

Also der erste Code ist sicherer als der zweite, als ob, wenn Sie den Code minimieren, es wird immer noch die gleiche Variable, d.

Geben Sie für ein Beispiel:

app.controller("MyCtrl", ['$scope', function(a){...}]);//a refers to $scope 

Also, der obige Code funktioniert gut, wenn Sie den Code minify wie $ Umfang anstelle von a.So eingespritzt wird, wenn Sie mehrere Parameter übergeben dann Fragen in dieser Bestellung Beispiel.

Blick auf die folgenden:

app.controller("MyCtrl", ['$scope','$timeout' ,function(a,t){...}]); 

wo ein als $ scope injiziert wird und t injiziert als $ Timeout.

Also, wenn Sie die Aufträge von Parametern wie

weitergegeben ändern

app.controller ("MyCtrl", [ '$ timeout', '$ Umfang', function (a, t) {...}]) ; Wobei ein ist $ timeout und t ist $ scope.

So, Bestellung Angelegenheiten in diesem Beispiel, aber in Ihrem zweiten Beispiel Code Reihenfolge spielt keine Rolle, da der Name zählt wie $ Scope, $ Timeout.

gibt es auch eine weitere Möglichkeit, Variablen zu injizieren, wenn Sie wie unter Ihrem ersten Beispiel-Code verwenden:

MyCtrl.$inject = ['$scope']; 

Für mehrere Parameter,

MyCtrl.$inject = ['$scope','$timeout']; 

So gibt es hauptsächlich drei Arten von Anmerkung:

  1. Implizite Annotation - Ihr erster Beispielcode
  2. Property Annotation
  3. $ injizieren - das $ inject Methode
  4. Inline Array Annotation - Ihr zweites Beispiel Code

Sie darüber here

Verwandte Themen