The beast's angular Api learn, translate and understand-$rootScope. Scope

The beast's Ng API learns--$rootScope. Scope

Here are some scope operations, such as create/logout/various listening and communication between scopes and so on.

$rootScope. Scope

You can use $injector to retrieve a root scope by using the $rootscope keyword.

You can create child scopes by using the $new () method. (Most child scopes are generated automatically when an HTML template is executed at compile time)

Format: $rootScope. Scope ([Providers],[instancecache])

[Providers]: The current scope needs to be provided by the Service factory map. The default is NG.

[Instancecache]: provides pre-instantiation services for services that require providers append/rewrite.

Method:

$new (isolate);

Creates a new sub-scope.

The parent scope broadcasts the $digest () and $digest () events. Scopes can be removed using $destroy () from a hierarchy of scopes.

The $destroy () separates its desired range and its child scope from the parent scope permanently to stop participating in model change detection and listening for notification calls.

The Isolate:boolean type. If the value is true, then the scope does not inherit the prototype from the parent scope. The scope is independent, and the properties of the parent scope cannot be seen here.

This is useful when writing small window components to prevent accidentally reading to their parent's state.

$watch (watchexpression,[listener],[objectequality]);

Registers a listener's callback function, which is executed when the watchexpression changes.

Each execution of the watchexpressions expression produces a $digest () and returns a value that will be monitored. ($digest () found that the watchexpressions has been changed and executed multiple times, and each time it is idempotent)

The listener is called only if the current watchexpressions and previous values do not want to wait. The change is judged by the Angular.equals function. You need to save the value of the object comparison, and you need to use angular.copy. This also means that looking at complex options will be detrimental to memory and performance effects.

Monitoring may change the model, which may cause other listening changes. Ng is executed until the value of the listener is steady. The replay iteration limit is 10, in order to prevent the deadlock from sinking into an infinite loop.

watchexpressions:string or function type. For each $digest cycle, a change in the return value triggers a call to listen.

A callback occurs when the return value of listener:watchexpression is changed.

Objectequality: Compare object equality comparisons (deep listening) using angular.equals instead of reference equality.

$watchGroup (Watchexpressions,listener);

$watch () for the watchexpressions array variable. Any change in the expression in the collection will trigger the execution of the listener.

Each item in the Watchexpressions array is observed by the standard $watch () operation, and each time the $digest () is examined to see if each item changes.

Executes when any of the items in the Watchexpressions array are changed.

$watchCollection (Obj,listener);

A shallow observation object property, and executes when it changes (for arrays, this means looking at array items; For objects, which means looking at properties). If a change is detected, the listener is triggered.

$digest ();

Handles all of the current scope and its sub-scopes for monitoring. Because the listener may change the model, $digest () will always perform to know the model is stable. This means that he may enter an infinite loop. If the number of iterations exceeds 10, this function throws a "Maximum iteration limit Exceeded" error.

$destroy ();

Removes the current scope (and all of its child scopes) from the parent domain. Deletion means that $digest () is no longer propagated to the current scope and its child scopes. Deleting also means that the current scope conforms to the conditions of the garbage collection.

$eval ([expression],[locals]);

Executes an expression on the current scope and returns the result. Any exception to the expression is propagated (captured). Useful when seeking the value of an angular expression.

$evalAsync ([expression]);

An expression (asynchronous) that executes the current scope at a later point in time.

$apply ([exp]);

$apply () is used to execute an expression inside angular outside the angular framework. (such as DOM events for browsers, SETTIMEOUT,XHR or third party libraries).

$on (Name,listener);

Listens for events of a given type.

Name: The event name of the listener.

Listener: The function that is called when an event occurs.

$emit (Name,args);

Propagates the specified event to the parent registered scope until the root scope.

Name: The names of the events emitted.

Args: One or more optional parameters that will be passed to the event listener.

$broadcast (Name,args);

Broadcasts the specified event to a subordinate registered scope.

Name: The names of the events emitted.

Args: One or more optional parameters that will be passed to the event listener.

$new, $destroy, $watch use the code :

<div ng-app= "Demo" >

<div ng-controller= "Democtrl" >

<input ng-model= "Text.words"/>

<input ng-list= "," ng-model= "list"/>

</div>

</div>

<script>

Angular.module ("Demo", [])

. Run (["$rootScope", function ($rootScope) {

var rootscope = $rootScope;

var _scope = Rootscope. $new ();

_scope.value = "Hello World";

_scope. $destroy ();//$ $destroyed: True

}])

. Controller ("Democtrl", ["$scope", function ($scope) {

$scope. Text = {words: "Hello world", id:1};

$scope. $watch ("Text", function (N,o) {

Console.log (N,o);

},true);

$scope. List = ["A", "B", "C", "D"];

$scope. $watchCollection ("list", function (N,o) {

Console.log (N,o);

});

}])

</script>

$on, $emit, $broadcast use the code :

<div ng-app= "Demo" >

<div ng-controller= "Democtrl" >

{{number| | ' Here where receive a number from Childscope '}}

<div ng-controller= "Childctrlone" >

<input type= "button" ng-click= "Tofatherscope ()" value= "click Me"/>

</div>

<div ng-controller= "Childctrltwo" >

{{number| | ' Here where receive a number from Fatherscope '}}

</div>

</div>

</div>

<script>

Angular.module ("Demo", [])

. Controller ("Democtrl", ["$scope", function ($scope) {

$scope. $on ("Tofather", function (e,v) {

$scope. Number = V;

$scope. $broadcast ("Tochild", V);

})

}])

. Controller ("Childctrlone", ["$scope", function ($scope) {

var count = 0;

$scope. Tofatherscope = function () {

Count + = 1;

$scope. $emit ("Tofather", count);

}

}])

. Controller ("Childctrltwo", ["$scope", function ($scope) {

$scope. $on ("Tochild", function (e,v) {

$scope. Number = V;

})

}])

</script>

About learning which comes out of these, sure enough to go to the API into Chinese understanding again, write code run again, will be on the meaning and usage of these functions to understand more. Simply say the beast's understanding of scope, like the tree structure, from the rootscope as the root node began to spread, there is a parent-child relationship, a sibling, and with inheritance, child scope inherits the attributes on the parent scope ...

The beast's angular Api learn, translate and understand-$rootScope. Scope