Introduction To AngularJS: Controller as Syntax - Day Twenty One

Controller as

AngularJS version 1.2 added a new feature that is nothing but ‘controller as’ syntax. It defines ‘named scope’. You can use this with the help of ng-controller directive. It defines properties on the functions (Controller), not the ‘$scope’.

Example - I created a controller name ‘AuthorCtrl as author’, here ‘author’ is nothing but my ‘named scope’.



The following example shows how to use this ‘controller as’ in application:

app.js

The above app.js file we created two controllers, first ‘AuthorCtrl’ for the ‘controller as’ syntax and second ‘SimpleCtrl’ in general we created like.

Index.html
The above html file we used two created controllers, first ‘SimpleCtrl’ used to display name and second ‘AuthorCtrl’ used to list of authors.

Output:


Great, Controller as syntax in AngularJS with example was created successfully!

Summary

I hope that beginners as well as students understand the concept of Controller as syntax in AngularJS with example. If you have any suggestions regarding this article, then please contact me. Stay tuned for other concepts of AngularJS coming soon!