$ scope nicht injiziert, immer noch referenziert. Warum funktioniert es?

Question

In der Angular Material Starter App wird ein 'UserController' definiert, ohne den $ scope-Service zu injizieren.

So im Konstruktor Funktion werden Variablen als Eigenschaften des dieses Objekts erstellt:

function UserController(userService, $mdSidenav, $mdBottomSheet, $timeout, $log) 
{ 
    var self = this; 

    self.selected  = null; 
    self.users  = [ ]; 
    self.selectUser = selectUser; 
    self.toggleList = toggleUsersList; 
    self.makeContact = makeContact; 

Aber dann, in der self.selectUser Funktion, der Wert der Array self.users als $ scope verwiesen .users

Es funktioniert, obwohl $ scope nie injiziert wurde. Und wenn ich es zu self.users ändere, funktioniert das auch.

Wird $ scope implizit in jeden Winkel-Controller injiziert? Spiegelt es das Objekt in einer Controller-Konstruktor-Funktion automatisch?

Was ist los?

Hier ist der Code https://github.com/angular/material-start

Answer 1

ich geklont nur die Repo- und getestet es nicht funktioniert, wie Sie sagten. $ Scope nicht Fehler definiert ist. Sie müssen Inject zu Konstruktor, um es zu arbeiten Nein, es ist nicht automatisch injiziert müssen Sie $ scope als Argument an den Controller übergeben, um es zu verwenden, sonst sollten Sie Fehler $ scope ist undefined es kann wie Ihre geben Bedingungen in der Funktion selectedUser und es nie zu $ ​​scope kommen, um darauf zu reagieren.

function UserController(userService, $mdSidenav, $mdBottomSheet, $timeout, $log , $scope) 
    { 
} 
function selectUser (user) { 
     //try to change this line and run code and select a user you will get error 
     self.selected = angular.isNumber(1) ? $scope.users[user] : user; 
     console.log($scope) //$scope is undefine 
    } 

Answer 2

Das sieht wie ein Defekt im Code aus. Dieser Kommentar schlägt die userService Parameter ursprünglich $scope benannt wurden:

/** 
    * Main Controller for the Angular Material Starter App 
    * @param $scope 
    * @param $mdSidenav 
    * @param avatarsService 
    * @constructor 
    */ 
function UserController(userService, $mdSidenav, $mdBottomSheet, $timeout, $log) { ... 

Answer 3

Javascript ist nicht eine kompilierte Sprache, sondern eine eines interpretiert. Dies bedeutet, dass der Code nur für die Abschnitte ausgeführt wird, die das Programm benötigt.

Sehen Sie diesen Beispielcode:

if(true){ 
    a = 12 
}else{ 
    hkjkjdkjhkjsfdjhsdf87678 
} 

HINWEIS: Dieser Code wird niemals irgendeine Art von Fehler werfen, da der Code nie getroffen wird.

In Ihrem Beispiel sieht dies wie ein Fehler im Code aus, der nie getroffen wird. Ich bin nicht sicher, warum Sie nicht den Referenzfehler erhalten, aber es muss injiziert werden.

Dieser Kommentar: https://github.com/angular/material-start/blob/master/app/src/users/UserController.js#L12

führt mich zu glauben, dass es dort vorher war, wurde aber irrtümlich entfernt.

Das erste Commit für diese Datei enthält jedoch auch den Parameter $ scope. Können Sie den if-Block aufteilen und überprüfen, ob der $ scope tatsächlich aufgerufen wird?

Ich habe auch durch das ganze Repo und die Geschichte auf diesem durchgeschaut. Es sieht so aus, als wäre das ein Fehler. Eine großartige Chance für Sie, eine Pull-Anfrage zu erstellen und zu Open Source beizutragen!

Answer 4

Der Code funktioniert, weil die Bedingung in

function selectUser (user) { 
    self.selected = angular.isNumber(user) ? $scope.users[user] : user; 
} 

nie true ergibt. Das an selectUser in der HTML ng-click-Direktive übergebene Argument ist keine Zahl, sondern ein Objekt.

Also ist der Wert, der self.selected zugewiesen ist, niemals der $ scope.users (wenn ich ihn protokolliere, bekomme ich den Referenzfehler), sondern das Benutzerobjekt.