Warum können Sie nicht ändern, Argumentnamen in Angular

Question

In eckigen, hier ist das einfache Beispiel für die Verwendung von $ http.

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
    $http.get("welcome.htm") 
    .then(function(response) { 
     $scope.myWelcome = response.data; 
    }); 
}); 

Was ich nicht verstehe, ist, dass $ http der Name des Arguments in der Callback-Funktion ist also warum macht es einen Unterschied machen, wenn Sie es auf etwas anderes umbenennen?

Zum Beispiel in JavaScript diese beiden sind offensichtlich genau die gleiche Funktion

function(a, b) { 
    return a+b; 
} 

function(c, d) { 
    return c+d; 
} 

Aber in diesem Fall, wenn ich $ http mit etwas anderem wie $ ersetzen HTTP wird es brechen?

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $HTTP) { 
    $HTTP.get("welcome.htm") 
    .then(function(response) { 
     $scope.myWelcome = response.data; 
    }); 
}); 

Answer 1

Sie können natürlich auch andere Namen verwenden, und in bestimmten Fällen sollten Sie ! Hier ist, wie:

angular.module('myApp', []) 
    .controller('myCtrl', ["$scope", "$http", function(thescope, thebackend) { 
    thebackend.get("welcome.htm") 
     .then(function(response) { 
     thescope.myWelcome = response.data; 
     }); 
    }]); 

hier das zweite Argument für controller(...) ein Array ist, mit einer spezifischen Struktur.

• Um eine Liste der Zeichenfolgen mit den Namen der Dienste, die Sie wünschen, eckig zu injizieren;
• Schließlich ist das letzte Element Ihre Controller-Konstruktorfunktion, die Argumente benötigt, die mit Diensten gefüllt werden, die Sie zuvor im Array angefordert haben.

Mit dieser Struktur können Sie die Argumente benennen, die Sie mögen.

Der Vorteil: Sie können diesen Code nun verkleinern. Bei der Verminde- rung bleiben die Zeichenfolgen im Array erhalten, sodass die korrekten Servicenamen für Angular erkannt werden. Die Argumente werden sicher minimiert, da sie sowieso alles sein können.

Die Version, die Sie ohne ein solches Array hatten, verwendet die Namen von Argumenten, um die entsprechenden Dienste zu finden. Wenn Sie diese Argumente anders benennen würden, wäre Angular nicht in der Lage zu wissen, welcher Dienst in dieses Argument eingefügt werden soll.

Für schnelle Demo-und Ad-hoc-Anwendungen funktioniert Ihre Version gut. Deshalb sehen Sie es oft, besonders in Dokumenten oder in SO-Antworten und -Fragen. Für Produktions-Apps empfehle ich immer die miniversionssichere Version.

The other answer by @slugonamission hat auch einige gute Nuggets von Informationen, einschließlich eines Links zu the appropriate documentation article on Dependency Injection.

PS. Ja, dein zweites Beispiel bricht, was du leicht ausprobieren kannst. Es gibt keine Möglichkeit für eckig zu wissen, was $HTTP ist, weil es nur über $http weiß.

Answer 2

Dies wird "Abhängigkeitsinjektion" genannt, und es gibt einen großen Artikel darüber in der AngularJS manual.

Kurz gesagt, Angular muss wissen, welche Abhängigkeiten Ihr Controller hat (in Ihrem Fall $scope und $HTTP), die er für Sie erstellt, und in Ihrem Controller übergeben. Die Standardmethode, die es tut, besteht darin, einfach die Namen Ihrer Parameter zu betrachten und daraus abzuleiten, welche Abhängigkeiten Sie haben. Wenn Sie beispielsweise $http zu $foo ändern, weiß Angular nicht mehr, dass es den Service $http injizieren muss.

Es gibt eine alternative Syntax, bei der Sie ein Array an den zweiten Parameter Ihres Controllers übergeben können, wobei das erste N-Element die Abhängigkeiten Ihres Controllers (und die Reihenfolge) angibt und das letzte Argument Ihre Controller-Funktion ist. Es sieht ungefähr so ​​aus:

app.controller('myCtrl', ["$scope", "$HTTP", function($scope, $HTTP) { 
    ... 
}]); 

In diesem Fall können Sie die Parameter aufrufen, was auch immer Sie wollen; die führenden Elemente im Array festlegen, was die Parameter, so wird dies immer noch funktionieren:

app.controller('myCtrl', ["$scope", "$HTTP", function($foo, $bar) { 

Und $foo wird Ihre Controller Umfang beziehen.