AngularJS: Views and Controllers ​

Reference: AngularJS in Action.

Understanding how views and controllers work--and more importantly how they relate to each other--is the foundation for understanding AngularJS. Much of the prototype work that we do starts with a simple view and controller, and as we achieve the desired functionality, we'll start to refactor out the view to directives and the controller to services.

• A view is the HTML after it has been through the AngularJS compilation process.
• A controller is responsible for defining methods and properties on scope so that they’re available to the view.
• Scope in AngularJS is simply a JavaScript object that has some events built into it so that the view and controller can be synchronized. It’s essentially the glue between the view and controller.
• The new controller-as syntax simplifies our controllers by implicitly assigning the controller instance to the scope itself.
• When a property is declared on scope, it's immediately available for binding in the view.
• When a mehod is declared on scope, it's available to be called from the view.
• AngularJS comes with prebuilt directives that you can use to perform operations such as ngRepeat for iterating over a collection and displaying each instance with a template or ngClick for capturing a mouse click and calling a method on the controller.
• You can use filters to filter out items in a collection in ngRepeat so that you only display a subset of the original array, as you saw in the case of our storyboard columns.