Learning AngularJS

Implementing Watches in a Controller

The code in Listings 8.1 and 8.2 demonstrate a simple example that implements the $watch, $watchGroup, and $watchCollection methods. The code in Listing 8.1 implements a controller that stores the values myColor, hits, and misses, as well as an object named myObj, in the scope. There are event handlers that update those values based on mouse clicks. Then in lines 18–25 the $watch, $watchGroup, and $watchCollection methods are implemented that adjust the object and a changes variable as the values change.

The code in Listing 8.2 implements an AngularJS template that enables the user to use the mouse to select the color and increment the hits and misses variables. The object and change values are displayed at ...