Abstracting logic with AngularJS controller inheritance

As with most frameworks, it’s a good practice in AngularJS apps to abstract common elements out of your application’s different controllers. Whilst injecting custom Services often represent a good way to achieve this, another complimentary approach is to make use of AngularJS’s controller inheritance. As an example, consider the following AngularJS controllers:

And the following html:

This will give the following output:

Menu1 value
Menu2 value
Default Value

This technique can be combined with injected services to allow complex data structures and common initialisation logic to be abstracted to parent controllers and then overridden where desired.


Leave a Reply