AngularJs Multiple Controllers in One View Page

An AngularJS application can contain one or more controllers as needed, in real application a good approach is to create a new controller for every significant view within the application.This approach will make your code cleaner and easy to maintain and upgrade.

Angular creates one $scope object for each controller. We also have a $rootScope accessible from every controllers.In case of multiple controllers AngularJS framework creates and pass a different $scope object to each controller so that data and methods of one controller not be accessed in another controller.


An AngularJS application can contain one or more controllers as needed, in real application a good approach is to create a new controller for every significant view within the application.This approach will make your code cleaner and easy to maintain and upgrade.

Angular creates one $scope object for each controller. We also have a $rootScope accessible from every controllers.In case of multiple controllers AngularJS framework creates and pass a different $scope object to each controller so that data and methods of one controller not be accessed in another controller.




Example on Multiple Controllers

We can define multiple controllers in the same HTML template and each one manages its own $scope object.

In the example we have two controllers, 'departmentController' and 'employeeController', and even though there are some model variables named in the same way for both the controllers, each one resides in its own $scope thus avoiding any conflict.







References :- AngulaJS Documentation



Related Articles

  1. Maven Overview




comments powered by Disqus