one controller is loading views from other controllers, how and why? - angularjs

Question

I have the following div in my index.html, whose controller is MainCtrl. This is the div used to load views from different controllers.
<div ng-controller="MainCtrl">
<div ng-view></div>
</div>
And these are my controllers:
.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/main', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
}).
when('/about', {
templateUrl: 'views/about.html',
controller: 'MainCtrl'
}).
when('/services', {
templateUrl: 'views/services.html',
controller: 'ServicesCtrl'
}).
when('/contact', {
templateUrl: 'views/contact.html',
controller: 'ContactCtrl'
}).
otherwise({redirectTo: '/main'})
}])
.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
$http.get('data/services.json').then(function(response){
$scope.services = response.data;
});
}])
.controller('ServicesCtrl', ['$scope', '$http', function($scope, $http) {
$http.get('data/services.json').then(function(response){
$scope.services = response.data;
});
}])
.controller('ContactCtrl', ['$scope', '$http', function($scope, $http) {
$http.get('data/locations.json').then(function(response){
$scope.locations = response.data;
});
}]);
It all works fine, but I do not understand how do all the views from different controllers get loaded automatically inside the <div ng-controller="MainCtrl"> ?
So for example if I go to mysite/services, it loads services.html, even though its controller is ServicesCtrl.
It seems logical to me that it should only load the view from MainCtrl, which is main.html and about.html, yet it loads them all irrespective of controller names, how come?

Answer 1

There shouldn't be an ng-controller="MainCtrl" because the controllers for each route are defined in your routing configuration.
If you have this in your page then when about or main load you will actually initialize 2 instances of MainCtrl. One instance will be invoked by the router and the other by ng-controller and this can be problematic.
That being said you could have an outer controller but it wouldn't be the same as the ones used in the routes