# ``

Improve this doc

MVC allows for a clean and testable separation between the behavior (controller) and the view (HTML template). A Controller is just a JavaScript class which is grafted onto the scope of the view. This makes it very easy for the controller and the view to share the model.

The model is a set of objects and primitives that are referenced from the Scope ($scope) object. This makes it very easy to test the controller in isolation since one can simply instantiate the controller and test without a view, because there is no connection between the controller and the view.

### Source

### Demo

## Things to notice

- The controller is defined in JavaScript and has no reference to the rendering logic.
- The controller is instantiated by Angular and injected into the view.
- The controller can be instantiated in isolation (without a view) and the code will still execute. This makes it very testable.
- The HTML view is a projection of the model. In the above example, the model is stored in the board variable.
- All of the controller's properties (such as board and nextMove) are available to the view.
- Changing the model changes the view.
- The view can call any controller function.
- In this example, the `setUrl()` and `readUrl()` functions copy the game state to/from the URL's hash so the browser's back button will undo game steps. See deep-linking. This example calls `$watch()` to set up a listener that invokes `readUrl()` when needed.