Menu
I am having 3 modules in my AngularJS App, e.g. main, home and product. main module having home and product module as dependencies (ng.module('main', ['home', 'product'])) while home and product modules are not having any dependencies(ng.module('product', []) ng.module('phome', [])), still product module can access home module service? WHY???
Below is sample code of my application, which is having the same scenario and same issue. And this is 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>
906
In software engineering, a circular dependency is a relation between two or more modules which either directly or indirectly depend on each other to function properly. Such modules are also known as mutually recursive.
You can use same directives/components in multiple modules without errors.
In this scenario, create another shared module in that import all the component which is being used in multiple module. In shared component. declare those component. And then import shared module in appmodule as well as in other module where you want to access.
You can import MemberCardModule into AppModule directly. Or import into ShareModule and import ShareModule into AppModule. It is important to import Modules into AppModule. And then you can you MemberCardModule.
The answer is pretty simple. Angular doesn't scope the contents of a module to the module itself. I've read somewhere that there have been discussions of adding this functionality, but I haven't yet seen it implemented.
To make matters worse, controllers applied to one imported module will be unique within your app. As an example, I was once using angular-ui bootstrap and someone on my team added an AlertController. We were pretty confused when the controller was never hit, but it was because angular-ui had already defined the controller.
So it's not just a question of visibility, but also of maintainability and naming.
Everything defined on a module is public.
199
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
