AngularJS module dependencies - clarification?

Question

I've been investigating the tutorial example from AngularJs's site ( this one)

(The main html is pretty empty (except for ng-view and ng-app=phonecatApp))

The app.js file includes this :

var phonecatApp = angular.module('phonecatApp', [
  'ngRoute',
  'phonecatControllers',
  'phonecatFilters',
  'phonecatServices'
]);

phonecatApp.config(['$routeProvider',...

Ok, so we have phonecatApp module with many dependencies.

But then I saw the controller.js file ( they opened a new module for the controllers)

/*1*/   var phonecatControllers = angular.module('phonecatControllers', []);
/*2*/   
/*3*/   phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', 'Phone',
/*4*/     function($scope, $routeParams, Phone) {
/*5*/       ...
/*6*/       });
/*7*/   
/*8*/     }]);

Phone is a service. ( which is on another module , different js file)

Question

In line #3 , how does it know what is the Phone parameter ? they didnt add any dependecy module in line #1 !
Same for the $routeParams , how does it know it ? they didn't add any dependency in line #1 to the ngRoute !

Am I missing something here ?

Answer 1

This citation from Pawel Kozlowski' book seems to be relevant:

A service defined in one of the application's modules is visible to all the other modules. In other words, hierarchy of modules doesn't influence services' visibility to other modules. When AngularJS bootstraps an application, it combines all the services defined across all the modules into one application, that is, global namespace.

Answer 2

The dependency injection works by default for every component of Angular.

This is because every component is defined inside the angular object, so it can track it all.

You can check this http://docs.angularjs.org/guide/di out to understand how it works.