AngularJS : Nested Controllers

I was working with AngularJS for like last 1 month and this is a quick post on Nested Controllers in AngularJS. In this post I am not going to write about what AngularJS is as this post is for developers who knows AngularJS.

One thing Google recommends about using a Controller is create one controller per functional area in your view. So when you do that, you will definitely be using Nested Controllers.

By creating nested controllers controllers can share model and functions through an inheritance tree. Nesting controllers is simple; you do it by simply assigning a controller to a DOM element that is inside another one, like so:

<div ng-controller="ParentController">

    <div ng-controller="ChildController">...</div&gt

</div>

Though we express this as nested controllers, the actual nesting happens in scopes. The $scope passed to a nested controller prototypically inherits from its parent controller’s $scope. In this case, this means that the $scope passed to ChildController will have access to all the properties of the $scope passed to ParentController.

Happy Coding.

Regards,

Jaliya