2015-06-01 6 views
6

Ich habe 3 Module in meinem AngularJS App, z.B. main, home und product. main Modul home und product Modul als Abhängigkeiten (ng.module('main', ['home', 'product'])) während home und product Module keine Abhängigkeiten aufweisen (ng.module('product', [])ng.module('phome', [])), noch product Modul home Modul Service zugreifen kann? WARUM???Warum können zwei verschiedene Module aufeinander zugreifen, wenn sie vom dritten Modul abhängen?

Unten ist Beispielcode meiner Anwendung, die das gleiche Szenario und das gleiche Problem hat. Und das ist JSfiddle Link.

<!DOCTYPE html> 
<html ng-app="main"> 
<body ng-controller="MainController as mainController"> 
{{mainController.name}} 
<script type="application/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
<script> 
(function (ng) { 
    var homeModule = ng.module('home', []); 
    homeModule.service("HomeService", [function() { 
     var homeService = this; 
     homeService.getName = function() { 
      return "Home Service"; 
     } 
    }]); 
    var productModule = ng.module('product', []); 
    productModule.service("ProductService", ["HomeService", function (HomeService) { 
     var productService = this; 
     productService.getName = function() { 
      return "Product Service - " + HomeService.getName(); 
     }; 
    }]); 
    var mainModule = ng.module('main', ['home', 'product']); 
    mainModule.controller("MainController", ['ProductService', function (ProductService) { 
     var mainController = this; 
     mainController.name = ProductService.getName(); 
    }]); 
})(angular); 
</script> 
</body> 
</html> 
+1

Dies liegt daran, Home-Service als globalen Variable definiert wird, die von überall in der App zugegriffen werden kann. Lesen Sie http://tutorials.jenkov.com/angularjs/dependency-injection.html für weitere Informationen. – vipulsharma

Antwort

3

Die Antwort ist ziemlich einfach. Angular beschränkt den Inhalt eines Moduls nicht auf das Modul selbst. Ich habe irgendwo gelesen, dass es Diskussionen über das Hinzufügen dieser Funktionalität gegeben hat, aber ich habe es noch nicht implementiert gesehen.

Erschwerend kommt hinzu, angewendet Controller eine importierte Modul in Ihrer Anwendung eindeutig sein. Als Beispiel habe ich einmal angular-ui bootstrap benutzt und jemand in meinem Team hat eine AlertController hinzugefügt. Wir waren ziemlich verwirrt, als der Controller nie getroffen wurde, aber es war, weil angular-ui den Controller bereits definiert hatte.

Es ist also nicht nur eine Frage der Sichtbarkeit, sondern auch der Wartbarkeit und Benennung.

Alles auf einem Modul definiert ist öffentlich.

+0

Das ist so schrecklich. Glücklich nach 1,5 Jahren angle'ing, habe ich noch auf dieses Problem zu laufen. – mmmeff

+0

Ich erinnere mich an den 'NameCtrl'-Standard, der von diesem Problem herrührt, um Konflikte mit' NameController' aus Bibliotheken von Drittanbietern zu vermeiden. Es hat mein Team tatsächlich drei oder vier Mal getroffen, bis wir nach der 'NameCtrl'-Konvention sagten. –

0

Es funktioniert, weil die Abhängigkeit von home Modul zum main Modul hinzugefügt wird und als main nur ruft die product service daher sollte es nur auf product Modul abhängig sein.

Wenn Sie die home Modulabhängigkeit vom main Modul entfernen (was der Fall sein sollte), funktioniert es nicht mehr.

TLDR; Die Kehrseite der nicht die home Abhängigkeit product Module hinzugefügt ist, dass es nicht nur arbeiten würde, indem die Produktabhängigkeit Zugabe aber Sie haben die home Abhängigkeit als auch hinzufügen mit product service zu arbeiten.

jsfiddle