Node.js, MongoDB, and AngularJS Web Development

Implementing the Scope Model

Once the controller has been defined, you can implement the scope, which involves linking HTML elements to scope variables, initializing the variables in the scope, and providing functionality to handle changes to the scope values.

Lines 9 and 10 in Listing 20.2 are <input> elements that are assigned to the first and last values in the scope. These elements provide a method to update the scope from the browser. If the user types in the input, the scope is also updated:

Click here to view code image

09       <input type="text" ng-model="first">10       <input type="text" ng-model="last">

Lines 3–5 in Listing 20.3 show the initial values of the scope being defined:

Click here to view code image

03   $scope.first = 'Some'; ...