Search within TutorialsPark

AngularJS Updating the Scope


Learn How to Explicitly update the scope manually.


AngularJS Controllers : Update the Scope Explicitly

An AngularJS scope is kept up to date automatically, but you also have an option to directly updating the scope using a AngularJS and JavaScript.

AngularJS can be integrated with other frameworks(like jQuery etc) by using three methods defined upon the scope objects.

Table : AngularJS RootScope Service Methods for Sending and Receiving Events

Method Description
$apply(expression) To apply a change to the scope.
$watch(expression, handler) To set a handler that will be invoked when the value reffered to by the expression
$watchCollection(object, handler) To set a handler function, that will be invoked when any properties of the object undergo a change.

AngularJS Updating the Scope : Controlling the State of Button

In the example, we integrate AngularJS with jQuery by using a checkbox to enable and disable a button created using jQuery UI.

The method $watch is used to register a handler function which is called when the value within the scope undergoes a change, its arguments are the property enabledButton and the handler function to receive the new and previous value of the property.

Example: AngularJS Updating the Scope Controlling the Button State.

Give it a TRY! » Note:When a change is applied in the scope,the handler function is invoked.

AngularJS Controller Organization : Controllers without any Scope

AngularJS allows you to create applications in which controllers do not interact with each other, i.e controllers without Scope.In this approach, the controller provides the data and sets the behaviour of the view without using scopes.

The example below, is not dependent on the $scope, it defines the data and set the behaviour using JavaScript keyword this, the expression within the directive ng-controller is of form name of controller as variable name.

Example: AngularJS Controller Organization Controllers without Scope

Give it a TRY! » Note: Scopeless Controllers are useful for small applications, to avoid complexities.