docs(api): update for alpha-32

This commit is contained in:
Naomi Black 2015-07-23 11:40:00 -07:00
parent 6d563434c7
commit 5588858bcc
213 changed files with 74 additions and 16223 deletions

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Ancestor <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L52-L52">angular2/src/core/annotations/decorators.ts (line 52)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Attribute <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L56-L56">angular2/src/core/annotations/decorators.ts (line 56)</a>
:markdown

View File

@ -1,12 +0,0 @@
.l-main-section
h2 Component <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L43-L43">angular2/src/core/annotations/decorators.ts (line 43)</a>
:markdown

View File

@ -1,195 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L812-L981">angular2/src/core/annotations_impl/annotations.ts (line 812)</a>
:markdown
Declare reusable UI building blocks for an application.
Each Angular component requires a single `@Component` and at least one `@View` annotation. The
`@Component`
annotation specifies when a component is instantiated, and which properties and hostListeners it
binds to.
When a component is instantiated, Angular
- creates a shadow DOM for the component.
- loads the selected template into the shadow DOM.
- creates a child <a href='../di/Injector-class.html'><code>Injector</code></a> which is configured with the `appInjector` for the
<a href='Component-var.html'><code>Component</code></a>.
All template expressions and statements are then evaluated against the component instance.
For details on the `@View` annotation, see <a href='View-var.html'><code>View</code></a>.
## Example
```
@Component({
selector: 'greet'
})
@View({
template: 'Hello {{name}}!'
})
class Greet {
name: string;
constructor() {
this.name = 'World';
}
}
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({selector, properties, events, host, exportAs, appInjector, lifecycle, hostInjector,
viewInjector, changeDetection = DEFAULT,
compileChildren = true}?: ComponentArgs)
:markdown
.l-sub-section
h3 changeDetection
:markdown
Defines the used change detection strategy.
When a component is instantiated, Angular creates a change detector, which is responsible for
propagating
the component's bindings.
The `changeDetection` property defines, whether the change detection will be checked every time
or only when the component
tells it to do so.
.l-sub-section
h3 appInjector
:markdown
Defines the set of injectable objects that are visible to a Component and its children.
The `appInjector` defined in the Component annotation allow you to configure a set of bindings
for the component's
injector.
When a component is instantiated, Angular creates a new child Injector, which is configured
with the bindings in
the Component `appInjector` annotation. The injectable objects then become available for
injection to the component
itself and any of the directives in the component's template, i.e. they are not available to
the directives which
are children in the component's light DOM.
The syntax for configuring the `appInjector` injectable is identical to <a href='../di/Injector-class.html'><code>Injector</code></a>
injectable configuration.
See <a href='../di/Injector-class.html'><code>Injector</code></a> for additional detail.
## Simple Example
Here is an example of a class that can be injected:
```
class Greeter {
greet(name:string) {
return 'Hello ' + name + '!';
}
}
@Component({
selector: 'greet',
appInjector: [
Greeter
]
})
@View({
template: `{{greeter.greet('world')}}!`,
directives: [Child]
})
class HelloWorld {
greeter:Greeter;
constructor(greeter:Greeter) {
this.greeter = greeter;
}
}
```
.l-sub-section
h3 viewInjector
:markdown
Defines the set of injectable objects that are visible to its view dom children.
## Simple Example
Here is an example of a class that can be injected:
```
class Greeter {
greet(name:string) {
return 'Hello ' + name + '!';
}
}
@Directive({
selector: 'needs-greeter'
})
class NeedsGreeter {
greeter:Greeter;
constructor(greeter:Greeter) {
this.greeter = greeter;
}
}
@Component({
selector: 'greet',
viewInjector: [
Greeter
]
})
@View({
template: `<needs-greeter></needs-greeter>`,
directives: [NeedsGreeter]
})
class HelloWorld {
}
```

View File

@ -1,48 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L981-L987">angular2/src/core/annotations_impl/annotations.ts (line 981)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 appInjector
:markdown
.l-sub-section
h3 viewInjector
:markdown
.l-sub-section
h3 changeDetection
:markdown

View File

@ -1,26 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L18-L22">angular2/src/core/annotations/decorators.ts (line 18)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 View
pre.prettyprint
code.
View(obj: ViewArgs)
:markdown

View File

@ -1,12 +0,0 @@
.l-main-section
h2 Directive <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L44-L44">angular2/src/core/annotations/decorators.ts (line 44)</a>
:markdown

View File

@ -1,867 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L4-L801">angular2/src/core/annotations_impl/annotations.ts (line 4)</a>
:markdown
Directives allow you to attach behavior to elements in the DOM.
<a href='Directive-var.html'><code>Directive</code></a>s with an embedded view are called <a href='Component-var.html'><code>Component</code></a>s.
A directive consists of a single directive annotation and a controller class. When the
directive's `selector` matches
elements in the DOM, the following steps occur:
1. For each directive, the `ElementInjector` attempts to resolve the directive's constructor
arguments.
2. Angular instantiates directives for each matched element using `ElementInjector` in a
depth-first order,
as declared in the HTML.
## Understanding How Injection Works
There are three stages of injection resolution.
- *Pre-existing Injectors*:
- The terminal <a href='../di/Injector-class.html'><code>Injector</code></a> cannot resolve dependencies. It either throws an error or, if
the dependency was
specified as `@Optional`, returns `null`.
- The platform injector resolves browser singleton resources, such as: cookies, title,
location, and others.
- *Component Injectors*: Each component instance has its own <a href='../di/Injector-class.html'><code>Injector</code></a>, and they follow
the same parent-child hierarchy
as the component instances in the DOM.
- *Element Injectors*: Each component instance has a Shadow DOM. Within the Shadow DOM each
element has an `ElementInjector`
which follow the same parent-child hierarchy as the DOM elements themselves.
When a template is instantiated, it also must instantiate the corresponding directives in a
depth-first order. The
current `ElementInjector` resolves the constructor dependencies for each directive.
Angular then resolves dependencies as follows, according to the order in which they appear in the
<a href='View-var.html'><code>View</code></a>:
1. Dependencies on the current element
2. Dependencies on element injectors and their parents until it encounters a Shadow DOM boundary
3. Dependencies on component injectors and their parents until it encounters the root component
4. Dependencies on pre-existing injectors
The `ElementInjector` can inject other directives, element-specific special objects, or it can
delegate to the parent
injector.
To inject other directives, declare the constructor parameter as:
- `directive:DirectiveType`: a directive on the current element only
- `@Ancestor() directive:DirectiveType`: any directive that matches the type between the current
element and the
Shadow DOM root. Current element is not included in the resolution, therefore even if it could
resolve it, it will
be ignored.
- `@Parent() directive:DirectiveType`: any directive that matches the type on a direct parent
element only.
- `@Query(DirectiveType) query:QueryList<DirectiveType>`: A live collection of direct child
directives.
- `@QueryDescendants(DirectiveType) query:QueryList<DirectiveType>`: A live collection of any
child directives.
To inject element-specific special objects, declare the constructor parameter as:
- `element: ElementRef` to obtain a reference to logical element in the view.
- `viewContainer: ViewContainerRef` to control child template instantiation, for
<a href='Directive-var.html'><code>Directive</code></a> directives only
- `bindingPropagation: BindingPropagation` to control change detection in a more granular way.
## Example
The following example demonstrates how dependency injection resolves constructor arguments in
practice.
Assume this HTML template:
```
<div dependency="1">
<div dependency="2">
<div dependency="3" my-directive>
<div dependency="4">
<div dependency="5"></div>
</div>
<div dependency="6"></div>
</div>
</div>
</div>
```
With the following `dependency` decorator and `SomeService` injectable class.
```
@Injectable()
class SomeService {
}
@Directive({
selector: '[dependency]',
properties: [
'id: dependency'
]
})
class Dependency {
id:string;
}
```
Let's step through the different ways in which `MyDirective` could be declared...
### No injection
Here the constructor is declared with no arguments, therefore nothing is injected into
`MyDirective`.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor() {
}
}
```
This directive would be instantiated with no dependencies.
### Component-level injection
Directives can inject any injectable instance from the closest component injector or any of its
parents.
Here, the constructor declares a parameter, `someService`, and injects the `SomeService` type
from the parent
component's injector.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(someService: SomeService) {
}
}
```
This directive would be instantiated with a dependency on `SomeService`.
### Injecting a directive from the current element
Directives can inject other directives declared on the current element.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(dependency: Dependency) {
expect(dependency.id).toEqual(3);
}
}
```
This directive would be instantiated with `Dependency` declared at the same element, in this case
`dependency="3"`.
### Injecting a directive from a direct parent element
Directives can inject other directives declared on a direct parent element. By definition, a
directive with a
`@Parent` annotation does not attempt to resolve dependencies for the current element, even if
this would satisfy
the dependency.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(@Parent() dependency: Dependency) {
expect(dependency.id).toEqual(2);
}
}
```
This directive would be instantiated with `Dependency` declared at the parent element, in this
case `dependency="2"`.
### Injecting a directive from any ancestor elements
Directives can inject other directives declared on any ancestor element (in the current Shadow
DOM), i.e. on the
parent element and its parents. By definition, a directive with an `@Ancestor` annotation does
not attempt to
resolve dependencies for the current element, even if this would satisfy the dependency.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(@Ancestor() dependency: Dependency) {
expect(dependency.id).toEqual(2);
}
}
```
Unlike the `@Parent` which only checks the parent, `@Ancestor` checks the parent, as well as its
parents recursively. If `dependency="2"` didn't exist on the direct parent, this injection would
have returned
`dependency="1"`.
### Injecting a live collection of direct child directives
A directive can also query for other child directives. Since parent directives are instantiated
before child directives, a directive can't simply inject the list of child directives. Instead,
the directive injects a <a href='../core/QueryList-class.html'><code>QueryList</code></a>, which updates its contents as children are added,
removed, or moved by a directive that uses a <a href='../core/ViewContainerRef-class.html'><code>ViewContainerRef</code></a> such as a `ng-for`, an
`ng-if`, or an `ng-switch`.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(@Query(Dependency) dependencies:QueryList<Dependency>) {
}
}
```
This directive would be instantiated with a <a href='../core/QueryList-class.html'><code>QueryList</code></a> which contains `Dependency` 4 and
6. Here, `Dependency` 5 would not be included, because it is not a direct child.
### Injecting a live collection of descendant directives
By passing the descendant flag to `@Query` above, we can include the children of the child
elements.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(@Query(Dependency, {descendants: true}) dependencies:QueryList<Dependency>) {
}
}
```
This directive would be instantiated with a Query which would contain `Dependency` 4, 5 and 6.
### Optional injection
The normal behavior of directives is to return an error when a specified dependency cannot be
resolved. If you
would like to inject `null` on unresolved dependency instead, you can annotate that dependency
with `@Optional()`.
This explicitly permits the author of a template to treat some of the surrounding directives as
optional.
```
@Directive({ selector: '[my-directive]' })
class MyDirective {
constructor(@Optional() dependency:Dependency) {
}
}
```
This directive would be instantiated with a `Dependency` directive found on the current element.
If none can be
found, the injector supplies `null` instead of throwing an error.
## Example
Here we use a decorator directive to simply define basic tool-tip behavior.
```
@Directive({
selector: '[tooltip]',
properties: [
'text: tooltip'
],
hostListeners: {
'onmouseenter': 'onMouseEnter()',
'onmouseleave': 'onMouseLeave()'
}
})
class Tooltip{
text:string;
overlay:Overlay; // NOT YET IMPLEMENTED
overlayManager:OverlayManager; // NOT YET IMPLEMENTED
constructor(overlayManager:OverlayManager) {
this.overlay = overlay;
}
onMouseEnter() {
// exact signature to be determined
this.overlay = this.overlayManager.open(text, ...);
}
onMouseLeave() {
this.overlay.close();
this.overlay = null;
}
}
```
In our HTML template, we can then add this behavior to a `<div>` or any other element with the
`tooltip` selector,
like so:
```
<div tooltip="some text here"></div>
```
Directives can also control the instantiation, destruction, and positioning of inline template
elements:
A directive uses a <a href='../core/ViewContainerRef-class.html'><code>ViewContainerRef</code></a> to instantiate, insert, move, and destroy views at
runtime.
The <a href='../core/ViewContainerRef-class.html'><code>ViewContainerRef</code></a> is created as a result of `<template>` element, and represents a
location in the current view
where these actions are performed.
Views are always created as children of the current <a href='View-var.html'><code>View</code></a>, and as siblings of the
`<template>` element. Thus a
directive in a child view cannot inject the directive that created it.
Since directives that create views via ViewContainers are common in Angular, and using the full
`<template>` element syntax is wordy, Angular
also supports a shorthand notation: `<li *foo="bar">` and `<li template="foo: bar">` are
equivalent.
Thus,
```
<ul>
<li *foo="bar" title="text"></li>
</ul>
```
Expands in use to:
```
<ul>
<template [foo]="bar">
<li title="text"></li>
</template>
</ul>
```
Notice that although the shorthand places `*foo="bar"` within the `<li>` element, the binding for
the directive
controller is correctly instantiated on the `<template>` element rather than the `<li>` element.
## Example
Let's suppose we want to implement the `unless` behavior, to conditionally include a template.
Here is a simple directive that triggers on an `unless` selector:
```
@Directive({
selector: '[unless]',
properties: ['unless']
})
export class Unless {
viewContainer: ViewContainerRef;
protoViewRef: ProtoViewRef;
prevCondition: boolean;
constructor(viewContainer: ViewContainerRef, protoViewRef: ProtoViewRef) {
this.viewContainer = viewContainer;
this.protoViewRef = protoViewRef;
this.prevCondition = null;
}
set unless(newCondition) {
if (newCondition && (isBlank(this.prevCondition) || !this.prevCondition)) {
this.prevCondition = true;
this.viewContainer.clear();
} else if (!newCondition && (isBlank(this.prevCondition) || this.prevCondition)) {
this.prevCondition = false;
this.viewContainer.create(this.protoViewRef);
}
}
}
```
We can then use this `unless` selector in a template:
```
<ul>
<li *unless="expr"></li>
</ul>
```
Once the directive instantiates the child view, the shorthand notation for the template expands
and the result is:
```
<ul>
<template [unless]="exp">
<li></li>
</template>
<li></li>
</ul>
```
Note also that although the `<li></li>` template still exists inside the `<template></template>`,
the instantiated
view occurs on the second `<li></li>` which is a sibling to the `<template>` element.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({
selector, properties, events, host, lifecycle, hostInjector, exportAs,
compileChildren = true,
}?: DirectiveArgs)
:markdown
.l-sub-section
h3 selector
:markdown
The CSS selector that triggers the instantiation of a directive.
Angular only allows directives to trigger on CSS selectors that do not cross element
boundaries.
`selector` may be declared as one of the following:
- `element-name`: select by element name.
- `.class`: select by class name.
- `[attribute]`: select by attribute name.
- `[attribute=value]`: select by attribute name and value.
- `:not(sub_selector)`: select only if the element does not match the `sub_selector`.
- `selector1, selector2`: select if either `selector1` or `selector2` matches.
Suppose we have a directive with an `input[type=text]` selector.
And the following HTML:
```html
<form>
<input type="text">
<input type="radio">
<form>
```
The directive would only be instantiated on the `<input type="text">` element.
.l-sub-section
h3 properties
:markdown
Enumerates the set of properties that accept data binding for a directive.
The `properties` property defines a set of `directiveProperty` to `bindingProperty`
configuration:
- `directiveProperty` specifies the component property where the value is written.
- `bindingProperty` specifies the DOM property where the value is read from.
You can include a <a href='../change_detection/Pipe-class.html'><code>Pipe</code></a> when specifying a `bindingProperty` to allow for data
transformation and structural change detection of the value. These pipes will be evaluated in
the context of this component.
## Syntax
There is no need to specify both `directiveProperty` and `bindingProperty` when they both have
the same value.
```
@Directive({
properties: [
'propertyName', // shorthand notation for 'propertyName: propertyName'
'directiveProperty1: bindingProperty1',
'directiveProperty2: bindingProperty2 | pipe1 | ...',
...
]
}
```
## Basic Property Binding
We can easily build a simple `Tooltip` directive that exposes a `tooltip` property, which can
be used in templates with standard Angular syntax. For example:
```
@Directive({
selector: '[tooltip]',
properties: [
'text: tooltip'
]
})
class Tooltip {
set text(value: string) {
// This will get called every time with the new value when the 'tooltip' property changes
}
}
```
We can then bind to the `tooltip' property as either an expression (`someExpression`) or as a
string literal, as shown in the HTML template below:
```html
<div [tooltip]="someExpression">...</div>
<div tooltip="Some Text">...</div>
```
Whenever the `someExpression` expression changes, the `properties` declaration instructs
Angular to update the `Tooltip`'s `text` property.
## Bindings With Pipes
You can also use pipes when writing binding definitions for a directive.
For example, we could write a binding that updates the directive on structural changes, rather
than on reference changes, as normally occurs in change detection.
See <a href='../change_detection/Pipe-class.html'><code>Pipe</code></a> and <a href='../pipes/KeyValueChanges-class.html'><code>KeyValueChanges</code></a> documentation for more details.
```
@Directive({
selector: '[class-set]',
properties: [
'classChanges: classSet | keyValDiff'
]
})
class ClassSet {
set classChanges(changes: KeyValueChanges) {
// This will get called every time the `class-set` expressions changes its structure.
}
}
```
The template that this directive is used in may also contain its own pipes. For example:
```html
<div [class-set]="someExpression | somePipe">
```
In this case, the two pipes compose as if they were inlined: `someExpression | somePipe |
keyValDiff`.
.l-sub-section
h3 events
:markdown
Enumerates the set of emitted events.
## Syntax
```
@Component({
events: ['statusChange']
})
class TaskComponent {
statusChange: EventEmitter;
constructor() {
this.statusChange = new EventEmitter();
}
onComplete() {
this.statusChange.next('completed');
}
}
```
Use `propertyName: eventName` when the event emitter property name is different from the name
of the emitted event:
```
@Component({
events: ['status: statusChange']
})
class TaskComponent {
status: EventEmitter;
constructor() {
this.status = new EventEmitter();
}
onComplete() {
this.status.next('completed');
}
}
```
.l-sub-section
h3 host
:markdown
Specifiy the events, actions, properties and attributes related to the host element.
## Events
Specifies which DOM hostListeners a directive listens to via a set of `(event)` to `method`
key-value pairs:
- `event1`: the DOM event that the directive listens to.
- `statement`: the statement to execute when the event occurs.
If the evalutation of the statement returns `false`, then `preventDefault`is applied on the DOM
event.
To listen to global events, a target must be added to the event name.
The target can be `window`, `document` or `body`.
When writing a directive event binding, you can also refer to the following local variables:
- `$event`: Current event object which triggered the event.
- `$target`: The source of the event. This will be either a DOM element or an Angular
directive. (will be implemented in later release)
## Syntax
```
@Directive({
host: {
'(event1)': 'onMethod1(arguments)',
'(target:event2)': 'onMethod2(arguments)',
...
}
}
```
## Basic Event Binding:
Suppose you want to write a directive that reacts to `change` events in the DOM and on
`resize` events in window.
You would define the event binding as follows:
```
@Directive({
selector: 'input',
host: {
'(change)': 'onChange($event)',
'(window:resize)': 'onResize($event)'
}
})
class InputDirective {
onChange(event:Event) {
// invoked when the input element fires the 'change' event
}
onResize(event:Event) {
// invoked when the window fires the 'resize' event
}
}
```
## Properties
Specifies which DOM properties a directives updates.
## Syntax
```
@Directive({
selector: 'input',
host: {
'[prop]': 'expression'
}
})
class InputDirective {
value:string;
}
```
In this example the prop property of the host element is updated with the expression value
every time it changes.
## Attributes
Specifies static attributes that should be propagated to a host element. Attributes specified
in `hostAttributes` are propagated only if a given attribute is not present on a host element.
## Syntax
```
@Directive({
selector: '[my-button]',
host: {
'role': 'button'
}
})
class MyButton {
}
```
In this example using `my-button` directive (ex.: `<div my-button></div>`) on a host element
(here: `<div>` ) will ensure that this element will get the "button" role.
## Actions
Specifies which DOM methods a directive can invoke.
## Syntax
```
@Directive({
selector: 'input',
host: {
'@emitFocus': 'focus()'
}
})
class InputDirective {
constructor() {
this.emitFocus = new EventEmitter();
}
focus() {
this.emitFocus.next();
}
}
```
In this example calling focus on InputDirective will result in calling focus on the input.
.l-sub-section
h3 lifecycle
:markdown
Specifies which lifecycle should be notified to the directive.
See <a href='onChange-const.html'><code>onChange</code></a>, <a href='onDestroy-const.html'><code>onDestroy</code></a>, <a href='onCheck-const.html'><code>onCheck</code></a>,
<a href='onInit-const.html'><code>onInit</code></a>, <a href='onAllChangesDone-const.html'><code>onAllChangesDone</code></a> for details.
.l-sub-section
h3 compileChildren
:markdown
If set to false the compiler does not compile the children of this directive.
.l-sub-section
h3 hostInjector
:markdown
Defines the set of injectable objects that are visible to a Directive and its light dom
children.
## Simple Example
Here is an example of a class that can be injected:
```
class Greeter {
greet(name:string) {
return 'Hello ' + name + '!';
}
}
@Directive({
selector: 'greet',
hostInjector: [
Greeter
]
})
class HelloWorld {
greeter:Greeter;
constructor(greeter:Greeter) {
this.greeter = greeter;
}
}
```
.l-sub-section
h3 exportAs
:markdown
Defines the name that can be used in the template to assign this directive to a variable.
## Simple Example
```
@Directive({
selector: 'child-dir',
exportAs: 'child'
})
class ChildDir {
}
@Component({
selector: 'main',
})
@View({
template: `<child-dir #c="child"></child-dir>`,
directives: [ChildDir]
})
class MainComponent {
}
```

View File

@ -1,113 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L801-L812">angular2/src/core/annotations_impl/annotations.ts (line 801)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 selector
:markdown
.l-sub-section
h3 properties
:markdown
.l-sub-section
h3 events
:markdown
.l-sub-section
h3 host
:markdown
.l-sub-section
h3 lifecycle
:markdown
.l-sub-section
h3 hostInjector
:markdown
.l-sub-section
h3 exportAs
:markdown
.l-sub-section
h3 compileChildren
:markdown

View File

@ -1,8 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L16-L18">angular2/src/core/annotations/decorators.ts (line 16)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Parent <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L51-L51">angular2/src/core/annotations/decorators.ts (line 51)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Query <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L57-L57">angular2/src/core/annotations/decorators.ts (line 57)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Self <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L50-L50">angular2/src/core/annotations/decorators.ts (line 50)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 Unbounded <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L53-L53">angular2/src/core/annotations/decorators.ts (line 53)</a>
:markdown

View File

@ -1,12 +0,0 @@
.l-main-section
h2 View <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L47-L47">angular2/src/core/annotations/decorators.ts (line 47)</a>
:markdown

View File

@ -1,26 +0,0 @@
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations/decorators.ts#L22-L24">angular2/src/core/annotations/decorators.ts (line 22)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 View
pre.prettyprint
code.
View(obj: ViewArgs)
:markdown

View File

@ -1,90 +0,0 @@
{
"index" : {
"title" : "Annotations",
"intro" : "Annotations provide the additional information that Angular requires in order to run your application. This module contains <a href='Component-var.html'><code>Component</code></a>, <a href='Directive-var.html'><code>Directive</code></a>, and <a href='View-var.html'><code>View</code></a> annotations, as well as<a href='Parent-var.html'><code>Parent</code></a> and <a href='Ancestor-var.html'><code>Ancestor</code></a> annotations that are used by Angular to resolve dependencies."
},
"ComponentAnnotation-class" : {
"title" : "ComponentAnnotation Class"
},
"DirectiveAnnotation-class" : {
"title" : "DirectiveAnnotation Class"
},
"ComponentArgs-interface" : {
"title" : "ComponentArgs Interface"
},
"DirectiveArgs-interface" : {
"title" : "DirectiveArgs Interface"
},
"onDestroy-const" : {
"title" : "onDestroy Const"
},
"onChange-const" : {
"title" : "onChange Const"
},
"onCheck-const" : {
"title" : "onCheck Const"
},
"onInit-const" : {
"title" : "onInit Const"
},
"onAllChangesDone-const" : {
"title" : "onAllChangesDone Const"
},
"DirectiveTypeDecorator-interface" : {
"title" : "DirectiveTypeDecorator Interface"
},
"ComponentTypeDecorator-interface" : {
"title" : "ComponentTypeDecorator Interface"
},
"ViewTypeDecorator-interface" : {
"title" : "ViewTypeDecorator Interface"
},
"Directive-var" : {
"title" : "Directive Var"
},
"Component-var" : {
"title" : "Component Var"
},
"View-var" : {
"title" : "View Var"
},
"Self-var" : {
"title" : "Self Var"
},
"Parent-var" : {
"title" : "Parent Var"
},
"Ancestor-var" : {
"title" : "Ancestor Var"
},
"Unbounded-var" : {
"title" : "Unbounded Var"
},
"Attribute-var" : {
"title" : "Attribute Var"
},
"Query-var" : {
"title" : "Query Var"
}
}

View File

@ -1,11 +0,0 @@
p.location-badge.
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/annotations.ts#L1-L15">angular2/annotations.ts (line 1)</a>
ul
for page, slug in public.docs[current.path[1]][current.path[2]][current.path[3]][current.path[4]]._data
if slug != 'index'
url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + current.path[4] + "/" + slug + ".html"
li.c8
!= partial("../../../../../_includes/_hover-card", {name: page.title, url: url })

View File

@ -1,26 +0,0 @@
.l-main-section
h2 onAllChangesDone <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L1127-L1127">angular2/src/core/annotations_impl/annotations.ts (line 1127)</a>
:markdown
Notify a directive when the bindings of all its children have been checked (whether they have
changed or not).
## Example:
```
@Directive({
selector: '[class-set]',
lifecycle: [onAllChangesDone]
})
class ClassSet {
onAllChangesDone() {
}
}
```

View File

@ -1,41 +0,0 @@
.l-main-section
h2 onChange <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L1057-L1057">angular2/src/core/annotations_impl/annotations.ts (line 1057)</a>
:markdown
Notify a directive when any of its bindings have changed.
This method is called right after the directive's bindings have been checked,
and before any of its children's bindings have been checked.
It is invoked only if at least one of the directive's bindings has changed.
## Example:
```
@Directive({
selector: '[class-set]',
properties: [
'propA',
'propB'
],
lifecycle: [onChange]
})
class ClassSet {
propA;
propB;
onChange(changes:{[idx: string, PropertyUpdate]}) {
// This will get called after any of the properties have been updated.
if (changes['propA']) {
// if propA was updated
}
if (changes['propA']) {
// if propB was updated
}
}
}
```

View File

@ -1,28 +0,0 @@
.l-main-section
h2 onCheck <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L1081-L1081">angular2/src/core/annotations_impl/annotations.ts (line 1081)</a>
:markdown
Notify a directive when it has been checked.
This method is called right after the directive's bindings have been checked,
and before any of its children's bindings have been checked.
It is invoked every time even when none of the directive's bindings has changed.
## Example:
```
@Directive({
selector: '[class-set]',
lifecycle: [onCheck]
})
class ClassSet {
onCheck() {
}
}
```

View File

@ -1,24 +0,0 @@
.l-main-section
h2 onDestroy <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L1019-L1019">angular2/src/core/annotations_impl/annotations.ts (line 1019)</a>
:markdown
Notify a directive whenever a <a href='View-var.html'><code>View</code></a> that contains it is destroyed.
## Example
```
@Directive({
...,
lifecycle: [onDestroy]
})
class ClassSet {
onDestroy() {
// invoked to notify directive of the containing view destruction.
}
}
```

View File

@ -1,28 +0,0 @@
.l-main-section
h2 onInit <span class="type">variable</span>
p.location-badge.
exported from <a href='../annotations'>angular2/annotations</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/annotations.ts#L1105-L1105">angular2/src/core/annotations_impl/annotations.ts (line 1105)</a>
:markdown
Notify a directive when it has been checked the first itme.
This method is called right after the directive's bindings have been checked,
and before any of its children's bindings have been checked.
It is invoked only once.
## Example:
```
@Directive({
selector: '[class-set]',
lifecycle: [onInit]
})
class ClassSet {
onInit() {
}
}
```

View File

@ -1,90 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L3-L15">angular2/src/change_detection/parser/ast.ts (line 3)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 eval
pre.prettyprint
code.
eval(context, locals: Locals)
:markdown
.l-sub-section
h3 isAssignable
:markdown
.l-sub-section
h3 assign
pre.prettyprint
code.
assign(context, locals: Locals, value)
:markdown
.l-sub-section
h3 visit
pre.prettyprint
code.
visit(visitor: AstVisitor)
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,144 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L311-L325">angular2/src/change_detection/parser/ast.ts (line 311)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(ast: AST, source: string, location: string)
:markdown
.l-sub-section
h3 ast
:markdown
.l-sub-section
h3 source
:markdown
.l-sub-section
h3 location
:markdown
.l-sub-section
h3 eval
pre.prettyprint
code.
eval(context, locals: Locals)
:markdown
.l-sub-section
h3 isAssignable
:markdown
.l-sub-section
h3 assign
pre.prettyprint
code.
assign(context, locals: Locals, value)
:markdown
.l-sub-section
h3 visit
pre.prettyprint
code.
visit(visitor: AstVisitor)
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,140 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L75-L107">angular2/src/change_detection/parser/ast.ts (line 75)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(receiver: AST, name: string, getter: Function, setter: Function)
:markdown
.l-sub-section
h3 receiver
:markdown
.l-sub-section
h3 name
:markdown
.l-sub-section
h3 getter
:markdown
.l-sub-section
h3 setter
:markdown
.l-sub-section
h3 eval
pre.prettyprint
code.
eval(context, locals: Locals)
:markdown
.l-sub-section
h3 isAssignable
:markdown
.l-sub-section
h3 assign
pre.prettyprint
code.
assign(context, locals: Locals, value)
:markdown
.l-sub-section
h3 visit
pre.prettyprint
code.
visit(visitor: AstVisitor)
:markdown

View File

@ -1,332 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L351-L423">angular2/src/change_detection/parser/ast.ts (line 351)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 visitImplicitReceiver
pre.prettyprint
code.
visitImplicitReceiver(ast: ImplicitReceiver)
:markdown
.l-sub-section
h3 visitInterpolation
pre.prettyprint
code.
visitInterpolation(ast: Interpolation)
:markdown
.l-sub-section
h3 visitLiteralPrimitive
pre.prettyprint
code.
visitLiteralPrimitive(ast: LiteralPrimitive)
:markdown
.l-sub-section
h3 visitAccessMember
pre.prettyprint
code.
visitAccessMember(ast: AccessMember)
:markdown
.l-sub-section
h3 visitSafeAccessMember
pre.prettyprint
code.
visitSafeAccessMember(ast: SafeAccessMember)
:markdown
.l-sub-section
h3 visitMethodCall
pre.prettyprint
code.
visitMethodCall(ast: MethodCall)
:markdown
.l-sub-section
h3 visitSafeMethodCall
pre.prettyprint
code.
visitSafeMethodCall(ast: SafeMethodCall)
:markdown
.l-sub-section
h3 visitFunctionCall
pre.prettyprint
code.
visitFunctionCall(ast: FunctionCall)
:markdown
.l-sub-section
h3 visitLiteralArray
pre.prettyprint
code.
visitLiteralArray(ast: LiteralArray)
:markdown
.l-sub-section
h3 visitLiteralMap
pre.prettyprint
code.
visitLiteralMap(ast: LiteralMap)
:markdown
.l-sub-section
h3 visitBinary
pre.prettyprint
code.
visitBinary(ast: Binary)
:markdown
.l-sub-section
h3 visitPrefixNot
pre.prettyprint
code.
visitPrefixNot(ast: PrefixNot)
:markdown
.l-sub-section
h3 visitConditional
pre.prettyprint
code.
visitConditional(ast: Conditional)
:markdown
.l-sub-section
h3 visitPipe
pre.prettyprint
code.
visitPipe(ast: Pipe)
:markdown
.l-sub-section
h3 visitKeyedAccess
pre.prettyprint
code.
visitKeyedAccess(ast: KeyedAccess)
:markdown
.l-sub-section
h3 visitAll
pre.prettyprint
code.
visitAll(asts: List&lt;any&gt;)
:markdown
.l-sub-section
h3 visitChain
pre.prettyprint
code.
visitChain(ast: Chain)
:markdown
.l-sub-section
h3 visitAssignment
pre.prettyprint
code.
visitAssignment(ast: Assignment)
:markdown
.l-sub-section
h3 visitIf
pre.prettyprint
code.
visitIf(ast: If)
:markdown

View File

@ -1,230 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/binding_record.ts#L9-L65">angular2/src/change_detection/binding_record.ts (line 9)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(mode: string, implicitReceiver: any, ast: AST, elementIndex: number, propertyName: string, setter: SetterFn, lifecycleEvent: string, directiveRecord: DirectiveRecord)
:markdown
.l-sub-section
h3 mode
:markdown
.l-sub-section
h3 implicitReceiver
:markdown
.l-sub-section
h3 ast
:markdown
.l-sub-section
h3 elementIndex
:markdown
.l-sub-section
h3 propertyName
:markdown
.l-sub-section
h3 setter
:markdown
.l-sub-section
h3 lifecycleEvent
:markdown
.l-sub-section
h3 directiveRecord
:markdown
.l-sub-section
h3 callOnChange
pre.prettyprint
code.
callOnChange()
:markdown
.l-sub-section
h3 isOnPushChangeDetection
pre.prettyprint
code.
isOnPushChangeDetection()
:markdown
.l-sub-section
h3 isDirective
pre.prettyprint
code.
isDirective()
:markdown
.l-sub-section
h3 isDirectiveLifecycle
pre.prettyprint
code.
isDirectiveLifecycle()
:markdown
.l-sub-section
h3 isElement
pre.prettyprint
code.
isElement()
:markdown
.l-sub-section
h3 isTextNode
pre.prettyprint
code.
isTextNode()
:markdown

View File

@ -1,13 +0,0 @@
.l-main-section
h2 CHECKED <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L13-L13">angular2/src/change_detection/constants.ts (line 13)</a>
:markdown
CHECKED means that the change detector should be skipped until its mode changes to
CHECK_ONCE or CHECK_ALWAYS.

View File

@ -1,13 +0,0 @@
.l-main-section
h2 CHECK_ALWAYS <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L19-L19">angular2/src/change_detection/constants.ts (line 19)</a>
:markdown
CHECK_ALWAYS means that after calling detectChanges the mode of the change detector
will remain CHECK_ALWAYS.

View File

@ -1,13 +0,0 @@
.l-main-section
h2 CHECK_ONCE <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L7-L7">angular2/src/change_detection/constants.ts (line 7)</a>
:markdown
CHECK_ONCE means that after calling detectChanges the mode of the change detector
will become CHECKED.

View File

@ -1,47 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/interfaces.ts#L4-L36">angular2/src/change_detection/interfaces.ts (line 4)</a>
:markdown
Interface used by Angular to control the change detection strategy for an application.
Angular implements the following change detection strategies by default:
- <a href='DynamicChangeDetection-class.html'><code>DynamicChangeDetection</code></a>: slower, but does not require `eval()`.
- <a href='JitChangeDetection-class.html'><code>JitChangeDetection</code></a>: faster, but requires `eval()`.
In JavaScript, you should always use `JitChangeDetection`, unless you are in an environment that
has
[CSP](https://developer.mozilla.org/en-US/docs/Web/Security/CSP), such as a Chrome Extension.
In Dart, use `DynamicChangeDetection` during development. The Angular transformer generates an
analog to the
`JitChangeDetection` strategy at compile time.
See: <a href='DynamicChangeDetection-class.html'><code>DynamicChangeDetection</code></a>, <a href='JitChangeDetection-class.html'><code>JitChangeDetection</code></a>,
<a href='PreGeneratedChangeDetection-class.html'><code>PreGeneratedChangeDetection</code></a>
# Example
```javascript
bootstrap(MyApp, [bind(ChangeDetection).toClass(DynamicChangeDetection)]);
```
.l-main-section
h2 Members
.l-sub-section
h3 createProtoChangeDetector
pre.prettyprint
code.
createProtoChangeDetector(definition: ChangeDetectorDefinition)
:markdown

View File

@ -1,80 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/exceptions.ts#L15-L28">angular2/src/change_detection/exceptions.ts (line 15)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(proto: ProtoRecord, originalException: any)
:markdown
.l-sub-section
h3 message
:markdown
.l-sub-section
h3 location
:markdown
.l-sub-section
h3 originalException
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,205 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/interfaces.ts#L41-L58">angular2/src/change_detection/interfaces.ts (line 41)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 parent
:markdown
.l-sub-section
h3 mode
:markdown
.l-sub-section
h3 addChild
pre.prettyprint
code.
addChild(cd: ChangeDetector)
:markdown
.l-sub-section
h3 addShadowDomChild
pre.prettyprint
code.
addShadowDomChild(cd: ChangeDetector)
:markdown
.l-sub-section
h3 removeChild
pre.prettyprint
code.
removeChild(cd: ChangeDetector)
:markdown
.l-sub-section
h3 removeShadowDomChild
pre.prettyprint
code.
removeShadowDomChild(cd: ChangeDetector)
:markdown
.l-sub-section
h3 remove
pre.prettyprint
code.
remove()
:markdown
.l-sub-section
h3 hydrate
pre.prettyprint
code.
hydrate(context: any, locals: Locals, directives: any)
:markdown
.l-sub-section
h3 dehydrate
pre.prettyprint
code.
dehydrate()
:markdown
.l-sub-section
h3 markPathToRootAsCheckOnce
pre.prettyprint
code.
markPathToRootAsCheckOnce()
:markdown
.l-sub-section
h3 detectChanges
pre.prettyprint
code.
detectChanges()
:markdown
.l-sub-section
h3 checkNoChanges
pre.prettyprint
code.
checkNoChanges()
:markdown

View File

@ -1,89 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/interfaces.ts#L60-L66">angular2/src/change_detection/interfaces.ts (line 60)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(id: string, strategy: string, variableNames: List&lt;string&gt;, bindingRecords: List&lt;BindingRecord&gt;, directiveRecords: List&lt;DirectiveRecord&gt;)
:markdown
.l-sub-section
h3 id
:markdown
.l-sub-section
h3 strategy
:markdown
.l-sub-section
h3 variableNames
:markdown
.l-sub-section
h3 bindingRecords
:markdown
.l-sub-section
h3 directiveRecords
:markdown

View File

@ -1,88 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detector_ref.ts#L2-L39">angular2/src/change_detection/change_detector_ref.ts (line 2)</a>
:markdown
Controls change detection.
<a href='ChangeDetectorRef-class.html'><code>ChangeDetectorRef</code></a> allows requesting checks for detectors that rely on observables. It
also allows detaching and
attaching change detector subtrees.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_cd: ChangeDetector)
:markdown
.l-sub-section
h3 requestCheck
pre.prettyprint
code.
requestCheck()
:markdown
Request to check all ON_PUSH ancestors.
.l-sub-section
h3 detach
pre.prettyprint
code.
detach()
:markdown
Detaches the change detector from the change detector tree.
The detached change detector will not be checked until it is reattached.
.l-sub-section
h3 reattach
pre.prettyprint
code.
reattach()
:markdown
Reattach the change detector to the change detector tree.
This also requests a check of this change detector. This reattached change detector will be
checked during the
next change detection run.

View File

@ -1,43 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/interfaces.ts#L36-L41">angular2/src/change_detection/interfaces.ts (line 36)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 notifyOnBinding
pre.prettyprint
code.
notifyOnBinding(bindingRecord: BindingRecord, value: any)
:markdown
.l-sub-section
h3 notifyOnAllChangesDone
pre.prettyprint
code.
notifyOnAllChangesDone()
:markdown

View File

@ -1,12 +0,0 @@
.l-main-section
h2 DEFAULT <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L35-L35">angular2/src/change_detection/constants.ts (line 35)</a>
:markdown
DEFAULT means that the change detector's mode will be set to CHECK_ALWAYS during hydration.

View File

@ -1,13 +0,0 @@
.l-main-section
h2 DETACHED <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L25-L25">angular2/src/change_detection/constants.ts (line 25)</a>
:markdown
DETACHED means that the change detector sub tree is not a part of the main tree and
should be skipped.

View File

@ -1,24 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/exceptions.ts#L28-L32">angular2/src/change_detection/exceptions.ts (line 28)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor()
:markdown

View File

@ -1,63 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/directive_record.ts#L2-L8">angular2/src/change_detection/directive_record.ts (line 2)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(elementIndex: number, directiveIndex: number)
:markdown
.l-sub-section
h3 elementIndex
:markdown
.l-sub-section
h3 directiveIndex
:markdown
.l-sub-section
h3 name
:markdown

View File

@ -1,127 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/directive_record.ts#L8-L36">angular2/src/change_detection/directive_record.ts (line 8)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({directiveIndex, callOnAllChangesDone, callOnChange, callOnCheck, callOnInit,
changeDetection}?: {
directiveIndex?: DirectiveIndex,
callOnAllChangesDone?: boolean,
callOnChange?: boolean,
callOnCheck?: boolean,
callOnInit?: boolean,
changeDetection?: string
})
:markdown
.l-sub-section
h3 directiveIndex
:markdown
.l-sub-section
h3 callOnAllChangesDone
:markdown
.l-sub-section
h3 callOnChange
:markdown
.l-sub-section
h3 callOnCheck
:markdown
.l-sub-section
h3 callOnInit
:markdown
.l-sub-section
h3 changeDetection
:markdown
.l-sub-section
h3 isOnPushChangeDetection
pre.prettyprint
code.
isOnPushChangeDetection()
:markdown

View File

@ -1,56 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L112-L129">angular2/src/change_detection/change_detection.ts (line 112)</a>
:markdown
Implements change detection that does not require `eval()`.
This is slower than <a href='JitChangeDetection-class.html'><code>JitChangeDetection</code></a>.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(registry: PipeRegistry)
:markdown
.l-sub-section
h3 registry
:markdown
.l-sub-section
h3 createProtoChangeDetector
pre.prettyprint
code.
createProtoChangeDetector(definition: ChangeDetectorDefinition)
:markdown

View File

@ -1,265 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/dynamic_change_detector.ts#L13-L326">angular2/src/change_detection/dynamic_change_detector.ts (line 13)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(id: string, changeControlStrategy: string, dispatcher: any, pipeRegistry: PipeRegistry, protos: List&lt;ProtoRecord&gt;, directiveRecords: List&lt;any&gt;)
:markdown
.l-sub-section
h3 locals
:markdown
.l-sub-section
h3 values
:markdown
.l-sub-section
h3 changes
:markdown
.l-sub-section
h3 pipes
:markdown
.l-sub-section
h3 prevContexts
:markdown
.l-sub-section
h3 directives
:markdown
.l-sub-section
h3 alreadyChecked
:markdown
.l-sub-section
h3 changeControlStrategy
:markdown
.l-sub-section
h3 dispatcher
:markdown
.l-sub-section
h3 pipeRegistry
:markdown
.l-sub-section
h3 protos
:markdown
.l-sub-section
h3 directiveRecords
:markdown
.l-sub-section
h3 hydrate
pre.prettyprint
code.
hydrate(context: any, locals: Locals, directives: any)
:markdown
.l-sub-section
h3 dehydrate
pre.prettyprint
code.
dehydrate()
:markdown
.l-sub-section
h3 hydrated
pre.prettyprint
code.
hydrated()
:markdown
.l-sub-section
h3 detectChangesInRecords
pre.prettyprint
code.
detectChangesInRecords(throwOnChange: boolean)
:markdown
.l-sub-section
h3 callOnAllChangesDone
pre.prettyprint
code.
callOnAllChangesDone()
:markdown

View File

@ -1,54 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/proto_change_detector.ts#L37-L58">angular2/src/change_detection/proto_change_detector.ts (line 37)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_pipeRegistry: PipeRegistry, definition: ChangeDetectorDefinition)
:markdown
.l-sub-section
h3 definition
:markdown
.l-sub-section
h3 instantiate
pre.prettyprint
code.
instantiate(dispatcher: any)
:markdown

View File

@ -1,54 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/exceptions.ts#L2-L15">angular2/src/change_detection/exceptions.ts (line 2)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(proto: ProtoRecord, change: any)
:markdown
.l-sub-section
h3 message
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,43 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L23-L29">angular2/src/change_detection/parser/ast.ts (line 23)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 eval
pre.prettyprint
code.
eval(context, locals: Locals)
:markdown
.l-sub-section
h3 visit
pre.prettyprint
code.
visit(visitor: AstVisitor)
:markdown

View File

@ -1,57 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L129-L148">angular2/src/change_detection/change_detection.ts (line 129)</a>
:markdown
Implements faster change detection by generating source code.
This requires `eval()`. For change detection that does not require `eval()`, see
<a href='DynamicChangeDetection-class.html'><code>DynamicChangeDetection</code></a> and <a href='PreGeneratedChangeDetection-class.html'><code>PreGeneratedChangeDetection</code></a>.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(registry: PipeRegistry)
:markdown
.l-sub-section
h3 registry
:markdown
.l-sub-section
h3 createProtoChangeDetector
pre.prettyprint
code.
createProtoChangeDetector(definition: ChangeDetectorDefinition)
:markdown

View File

@ -1,26 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/lexer.ts#L18-L31">angular2/src/change_detection/parser/lexer.ts (line 18)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 tokenize
pre.prettyprint
code.
tokenize(text: string)
:markdown

View File

@ -1,71 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/ast.ts#L159-L169">angular2/src/change_detection/parser/ast.ts (line 159)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(expressions: List&lt;any&gt;)
:markdown
.l-sub-section
h3 expressions
:markdown
.l-sub-section
h3 eval
pre.prettyprint
code.
eval(context, locals: Locals)
:markdown
.l-sub-section
h3 visit
pre.prettyprint
code.
visit(visitor: AstVisitor)
:markdown

View File

@ -1,118 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/locals.ts#L2-L44">angular2/src/change_detection/parser/locals.ts (line 2)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(parent: Locals, current: Map&lt;any, any&gt;)
:markdown
.l-sub-section
h3 parent
:markdown
.l-sub-section
h3 current
:markdown
.l-sub-section
h3 contains
pre.prettyprint
code.
contains(name: string)
:markdown
.l-sub-section
h3 get
pre.prettyprint
code.
get(name: string)
:markdown
.l-sub-section
h3 set
pre.prettyprint
code.
set(name: string, value)
:markdown
.l-sub-section
h3 clearValues
pre.prettyprint
code.
clearValues()
:markdown

View File

@ -1,55 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/null_pipe.ts#L14-L34">angular2/src/change_detection/pipes/null_pipe.ts (line 14)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 called
:markdown
.l-sub-section
h3 supports
pre.prettyprint
code.
supports(obj)
:markdown
.l-sub-section
h3 transform
pre.prettyprint
code.
transform(value)
:markdown

View File

@ -1,57 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/null_pipe.ts#L2-L14">angular2/src/change_detection/pipes/null_pipe.ts (line 2)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor()
:markdown
.l-sub-section
h3 supports
pre.prettyprint
code.
supports(obj)
:markdown
.l-sub-section
h3 create
pre.prettyprint
code.
create(cdRef)
:markdown

View File

@ -1,12 +0,0 @@
.l-main-section
h2 ON_PUSH <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/constants.ts#L30-L30">angular2/src/change_detection/constants.ts (line 30)</a>
:markdown
ON_PUSH means that the change detector's mode will be set to CHECK_ONCE during hydration.

View File

@ -1,126 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/parser/parser.ts#L54-L115">angular2/src/change_detection/parser/parser.ts (line 54)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_lexer: Lexer, providedReflector?: Reflector)
:markdown
.l-sub-section
h3 parseAction
pre.prettyprint
code.
parseAction(input: string, location: any)
:markdown
.l-sub-section
h3 parseBinding
pre.prettyprint
code.
parseBinding(input: string, location: any)
:markdown
.l-sub-section
h3 addPipes
pre.prettyprint
code.
addPipes(bindingAst: ASTWithSource, pipes: List&lt;string&gt;)
:markdown
.l-sub-section
h3 parseTemplateBindings
pre.prettyprint
code.
parseTemplateBindings(input: string, location: any)
:markdown
.l-sub-section
h3 parseInterpolation
pre.prettyprint
code.
parseInterpolation(input: string, location: any)
:markdown
.l-sub-section
h3 wrapLiteralPrimitive
pre.prettyprint
code.
wrapLiteralPrimitive(input: string, location: any)
:markdown

View File

@ -1,76 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/pipe.ts#L29-L56">angular2/src/change_detection/pipes/pipe.ts (line 29)</a>
:markdown
An interface for extending the list of pipes known to Angular.
If you are writing a custom <a href='Pipe-class.html'><code>Pipe</code></a>, you must extend this interface.
#Example
```
class DoublePipe extends Pipe {
supports(obj) {
return true;
}
transform(value) {
return `${value}${value}`;
}
}
```
.l-main-section
h2 Members
.l-sub-section
h3 supports
pre.prettyprint
code.
supports(obj)
:markdown
.l-sub-section
h3 onDestroy
pre.prettyprint
code.
onDestroy()
:markdown
.l-sub-section
h3 transform
pre.prettyprint
code.
transform(value: any)
:markdown

View File

@ -1,43 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/pipe.ts#L56-L70">angular2/src/change_detection/pipes/pipe.ts (line 56)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 supports
pre.prettyprint
code.
supports(obs)
:markdown
.l-sub-section
h3 create
pre.prettyprint
code.
create(cdRef)
:markdown

View File

@ -1,54 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/pipe_registry.ts#L5-L25">angular2/src/change_detection/pipes/pipe_registry.ts (line 5)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(config)
:markdown
.l-sub-section
h3 config
:markdown
.l-sub-section
h3 get
pre.prettyprint
code.
get(type: string, obj, cdRef: ChangeDetectorRef)
:markdown

View File

@ -1,54 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L80-L112">angular2/src/change_detection/change_detection.ts (line 80)</a>
:markdown
Implements change detection using a map of pregenerated proto detectors.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(registry: PipeRegistry, protoChangeDetectorsForTest?: StringMap&lt;string, Function&gt;)
:markdown
.l-sub-section
h3 registry
:markdown
.l-sub-section
h3 createProtoChangeDetector
pre.prettyprint
code.
createProtoChangeDetector(definition: ChangeDetectorDefinition)
:markdown

View File

@ -1,26 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/interfaces.ts#L58-L60">angular2/src/change_detection/interfaces.ts (line 58)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 instantiate
pre.prettyprint
code.
instantiate(dispatcher: any)
:markdown

View File

@ -1,40 +0,0 @@
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/pipes/pipe.ts#L1-L19">angular2/src/change_detection/pipes/pipe.ts (line 1)</a>
:markdown
Indicates that the result of a <a href='Pipe-class.html'><code>Pipe</code></a> transformation has changed even though the reference
has not changed.
The wrapped value will be unwrapped by change detection, and the unwrapped value will be stored.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(wrapped: any)
:markdown
.l-sub-section
h3 wrapped
:markdown

View File

@ -1,174 +0,0 @@
{
"index" : {
"title" : "Change Detection",
"intro" : "Change detection enables data binding in Angular."
},
"ASTWithSource-class" : {
"title" : "ASTWithSource Class"
},
"AST-class" : {
"title" : "AST Class"
},
"AstTransformer-class" : {
"title" : "AstTransformer Class"
},
"AccessMember-class" : {
"title" : "AccessMember Class"
},
"LiteralArray-class" : {
"title" : "LiteralArray Class"
},
"ImplicitReceiver-class" : {
"title" : "ImplicitReceiver Class"
},
"Lexer-class" : {
"title" : "Lexer Class"
},
"Parser-class" : {
"title" : "Parser Class"
},
"Locals-class" : {
"title" : "Locals Class"
},
"DehydratedException-class" : {
"title" : "DehydratedException Class"
},
"ExpressionChangedAfterItHasBeenChecked-class" : {
"title" : "ExpressionChangedAfterItHasBeenChecked Class"
},
"ChangeDetectionError-class" : {
"title" : "ChangeDetectionError Class"
},
"ProtoChangeDetector-interface" : {
"title" : "ProtoChangeDetector Interface"
},
"ChangeDetector-interface" : {
"title" : "ChangeDetector Interface"
},
"ChangeDispatcher-interface" : {
"title" : "ChangeDispatcher Interface"
},
"ChangeDetection-class" : {
"title" : "ChangeDetection Class"
},
"ChangeDetectorDefinition-class" : {
"title" : "ChangeDetectorDefinition Class"
},
"CHECK_ONCE-const" : {
"title" : "CHECK_ONCE Const"
},
"CHECK_ALWAYS-const" : {
"title" : "CHECK_ALWAYS Const"
},
"DETACHED-const" : {
"title" : "DETACHED Const"
},
"CHECKED-const" : {
"title" : "CHECKED Const"
},
"ON_PUSH-const" : {
"title" : "ON_PUSH Const"
},
"DEFAULT-const" : {
"title" : "DEFAULT Const"
},
"DynamicProtoChangeDetector-class" : {
"title" : "DynamicProtoChangeDetector Class"
},
"BindingRecord-class" : {
"title" : "BindingRecord Class"
},
"DirectiveIndex-class" : {
"title" : "DirectiveIndex Class"
},
"DirectiveRecord-class" : {
"title" : "DirectiveRecord Class"
},
"DynamicChangeDetector-class" : {
"title" : "DynamicChangeDetector Class"
},
"ChangeDetectorRef-class" : {
"title" : "ChangeDetectorRef Class"
},
"PipeRegistry-class" : {
"title" : "PipeRegistry Class"
},
"uninitialized-var" : {
"title" : "uninitialized Var"
},
"WrappedValue-class" : {
"title" : "WrappedValue Class"
},
"Pipe-class" : {
"title" : "Pipe Class"
},
"PipeFactory-class" : {
"title" : "PipeFactory Class"
},
"NullPipe-class" : {
"title" : "NullPipe Class"
},
"NullPipeFactory-class" : {
"title" : "NullPipeFactory Class"
},
"defaultPipes-var" : {
"title" : "defaultPipes Var"
},
"DynamicChangeDetection-class" : {
"title" : "DynamicChangeDetection Class"
},
"JitChangeDetection-class" : {
"title" : "JitChangeDetection Class"
},
"PreGeneratedChangeDetection-class" : {
"title" : "PreGeneratedChangeDetection Class"
},
"preGeneratedProtoDetectors-var" : {
"title" : "preGeneratedProtoDetectors Var"
},
"defaultPipeRegistry-var" : {
"title" : "defaultPipeRegistry Var"
}
}

View File

@ -1,11 +0,0 @@
.l-main-section
h2 defaultPipeRegistry <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L150-L150">angular2/src/change_detection/change_detection.ts (line 150)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 defaultPipes <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L62-L69">angular2/src/change_detection/change_detection.ts (line 62)</a>
:markdown

View File

@ -1,11 +0,0 @@
p.location-badge.
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/change_detection.ts#L1-L58">angular2/change_detection.ts (line 1)</a>
ul
for page, slug in public.docs[current.path[1]][current.path[2]][current.path[3]][current.path[4]]._data
if slug != 'index'
url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + current.path[4] + "/" + slug + ".html"
li.c8
!= partial("../../../../../_includes/_hover-card", {name: page.title, url: url })

View File

@ -1,14 +0,0 @@
.l-main-section
h2 preGeneratedProtoDetectors <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection.ts#L78-L78">angular2/src/change_detection/change_detection.ts (line 78)</a>
:markdown
Map from <a href='ChangeDetectorDefinition-class.html#id'><code>ChangeDetectorDefinition</code></a> to a factory method which takes a
<a href='PipeRegistry-class.html'><code>PipeRegistry</code></a> and a <a href='ChangeDetectorDefinition-class.html'><code>ChangeDetectorDefinition</code></a> and generates a
<a href='ProtoChangeDetector-interface.html'><code>ProtoChangeDetector</code></a> associated with the definition.

View File

@ -1,11 +0,0 @@
.l-main-section
h2 uninitialized <span class="type">variable</span>
p.location-badge.
exported from <a href='../change_detection'>angular2/change_detection</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/change_detection/change_detection_util.ts#L8-L8">angular2/src/change_detection/change_detection_util.ts (line 8)</a>
:markdown

View File

@ -1,93 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/visibility.ts#L110-L173">angular2/src/core/annotations_impl/visibility.ts (line 110)</a>
:markdown
Specifies that an injector should retrieve a dependency from any ancestor element within the same
shadow boundary.
An ancestor is any element between the parent element and the shadow root.
Use <a href='../annotations/Unbounded-var.html'><code>Unbounded</code></a> if you need to cross upper shadow boundaries.
## Example
Here is a simple directive that retrieves a dependency from an ancestor element.
```
@Directive({
selector: '[dependency]',
properties: [
'id: dependency'
]
})
class Dependency {
id:string;
}
@Directive({
selector: '[my-directive]'
})
class Dependency {
constructor(@Ancestor() dependency:Dependency) {
expect(dependency.id).toEqual(2);
};
}
```
We use this with the following HTML template:
```
<div dependency="1">
<div dependency="2">
<div>
<div dependency="3" my-directive></div>
</div>
</div>
</div>
```
The `@Ancestor()` annotation in our constructor forces the injector to retrieve the dependency
from the
nearest ancestor element:
- The current element `dependency="3"` is skipped because it is not an ancestor.
- Next parent has no directives `<div>`
- Next parent has the `Dependency` directive and so the dependency is satisfied.
Angular injects `dependency=2`.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({self}?: {self?: boolean})
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,80 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/application.ts#L317-L339">angular2/src/core/application.ts (line 317)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(hostComponent: ComponentRef, hostComponentType: Type, injector: Injector)
:markdown
.l-sub-section
h3 hostComponentType
:markdown
.l-sub-section
h3 hostComponent
:markdown
.l-sub-section
h3 dispose
pre.prettyprint
code.
dispose()
:markdown
.l-sub-section
h3 injector
:markdown

View File

@ -1,90 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/di.ts#L3-L46">angular2/src/core/annotations_impl/di.ts (line 3)</a>
:markdown
Specifies that a constant attribute value should be injected.
The directive can inject constant string literals of host element attributes.
## Example
Suppose we have an `<input>` element and want to know its `type`.
```html
<input type="text">
```
A decorator can inject string literal `text` like so:
```javascript
@Directive({
selector: `input'
})
class InputDirective {
constructor(@Attribute('type') type) {
// type would be `text` in this example
}
}
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(attributeName: string)
:markdown
.l-sub-section
h3 attributeName
:markdown
.l-sub-section
h3 token
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,40 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/compiler.ts#L58-L269">angular2/src/core/compiler/compiler.ts (line 58)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(reader: DirectiveResolver, cache: CompilerCache, templateResolver: TemplateResolver, componentUrlMapper: ComponentUrlMapper, urlResolver: UrlResolver, render:RenderCompiler, protoViewFactory: ProtoViewFactory)
:markdown
.l-sub-section
h3 compileInHost
pre.prettyprint
code.
compileInHost(componentTypeOrBinding: Type | Binding)
:markdown

View File

@ -1,96 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/compiler.ts#L27-L58">angular2/src/core/compiler/compiler.ts (line 27)</a>
:markdown
Cache that stores the AppProtoView of the template of a component.
Used to prevent duplicate work and resolve cyclic dependencies.
.l-main-section
h2 Members
.l-sub-section
h3 set
pre.prettyprint
code.
set(component: Type, protoView: AppProtoView)
:markdown
.l-sub-section
h3 get
pre.prettyprint
code.
get(component: Type)
:markdown
.l-sub-section
h3 setHost
pre.prettyprint
code.
setHost(component: Type, protoView: AppProtoView)
:markdown
.l-sub-section
h3 getHost
pre.prettyprint
code.
getHost(component: Type)
:markdown
.l-sub-section
h3 clear
pre.prettyprint
code.
clear()
:markdown

View File

@ -1,75 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/dynamic_component_loader.ts#L7-L16">angular2/src/core/compiler/dynamic_component_loader.ts (line 7)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(location: ElementRef, instance: any, dispose: Function)
:markdown
.l-sub-section
h3 location
:markdown
.l-sub-section
h3 instance
:markdown
.l-sub-section
h3 dispose
:markdown
.l-sub-section
h3 hostView
:markdown

View File

@ -1,26 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/directive_resolver.ts#L4-L20">angular2/src/core/compiler/directive_resolver.ts (line 4)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 resolve
pre.prettyprint
code.
resolve(type: Type)
:markdown

View File

@ -1,85 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/dynamic_component_loader.ts#L16-L81">angular2/src/core/compiler/dynamic_component_loader.ts (line 16)</a>
:markdown
Service for dynamically loading a Component into an arbitrary position in the internal Angular
application tree.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_compiler: Compiler, _viewManager: AppViewManager)
:markdown
.l-sub-section
h3 loadAsRoot
pre.prettyprint
code.
loadAsRoot(typeOrBinding: Type | Binding, overrideSelector?: string, injector?: Injector)
:markdown
Loads a root component that is placed at the first element that matches the
component's selector.
The loaded component receives injection normally as a hosted view.
.l-sub-section
h3 loadIntoLocation
pre.prettyprint
code.
loadIntoLocation(typeOrBinding: Type | Binding, hostLocation: ElementRef, anchorName: string, injector?: Injector)
:markdown
Loads a component into the component view of the provided ElementRef
next to the element with the given name
The loaded component receives
injection normally as a hosted view.
.l-sub-section
h3 loadNextToLocation
pre.prettyprint
code.
loadNextToLocation(typeOrBinding: Type | Binding, location: ElementRef, injector?: Injector)
:markdown
Loads a component next to the provided ElementRef. The loaded component receives
injection normally as a hosted view.

View File

@ -1,83 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/element_ref.ts#L4-L35">angular2/src/core/compiler/element_ref.ts (line 4)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(parentView: ViewRef, boundElementIndex: number)
:markdown
.l-sub-section
h3 parentView
:markdown
.l-sub-section
h3 boundElementIndex
:markdown
.l-sub-section
h3 domElement
:markdown
Exposes the underlying DOM element.
(DEPRECATED way of accessing the DOM, replacement coming)
.l-sub-section
h3 getAttribute
pre.prettyprint
code.
getAttribute(name: string)
:markdown
Gets an attribute from the underlying DOM element.
(DEPRECATED way of accessing the DOM, replacement coming)

View File

@ -1,115 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/zone/ng_zone.ts#L4-L216">angular2/src/core/zone/ng_zone.ts (line 4)</a>
:markdown
A wrapper around zones that lets you schedule tasks after it has executed a task.
The wrapper maintains an "inner" and an "mount" `Zone`. The application code will executes
in the "inner" zone unless `runOutsideAngular` is explicitely called.
A typical application will create a singleton `NgZone`. The outer `Zone` is a fork of the root
`Zone`. The default `onTurnDone` runs the Angular change detection.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({enableLongStackTrace})
:markdown
Associates with this
- a "root" zone, which the one that instantiated this.
- an "inner" zone, which is a child of the root zone.
.l-sub-section
h3 initCallbacks
pre.prettyprint
code.
initCallbacks({onTurnStart, onTurnDone, onErrorHandler}?: {
onTurnStart?: /*() =&gt; void*/ Function,
onTurnDone?: /*() =&gt; void*/ Function,
onErrorHandler?: /*(error, stack) =&gt; void*/ Function
})
:markdown
Initializes the zone hooks.
.l-sub-section
h3 run
pre.prettyprint
code.
run(fn)
:markdown
Runs `fn` in the inner zone and returns whatever it returns.
In a typical app where the inner zone is the Angular zone, this allows one to make use of the
Angular's auto digest mechanism.
```
var zone: NgZone = [ref to the application zone];
zone.run(() => {
// the change detection will run after this function and the microtasks it enqueues have
executed.
});
```
.l-sub-section
h3 runOutsideAngular
pre.prettyprint
code.
runOutsideAngular(fn)
:markdown
Runs `fn` in the outer zone and returns whatever it returns.
In a typical app where the inner zone is the Angular zone, this allows one to escape Angular's
auto-digest mechanism.
```
var zone: NgZone = [ref to the application zone];
zone.runOusideAngular(() => {
element.onClick(() => {
// Clicking on the element would not trigger the change detection
});
});
```

View File

@ -1,28 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/interfaces.ts#L27-L33">angular2/src/core/compiler/interfaces.ts (line 27)</a>
:markdown
Defines lifecycle method [onAllChangesDone ] called when the bindings of all its children have
been changed.
.l-main-section
h2 Members
.l-sub-section
h3 onAllChangesDone
pre.prettyprint
code.
onAllChangesDone()
:markdown

View File

@ -1,28 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/interfaces.ts#L7-L12">angular2/src/core/compiler/interfaces.ts (line 7)</a>
:markdown
Defines lifecycle method [onChange] called after all of component's bound
properties are updated.
.l-main-section
h2 Members
.l-sub-section
h3 onChange
pre.prettyprint
code.
onChange(changes: StringMap&lt;string, any&gt;)
:markdown

View File

@ -1,27 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/interfaces.ts#L17-L22">angular2/src/core/compiler/interfaces.ts (line 17)</a>
:markdown
Defines lifecycle method [onCheck] called when a directive is being checked.
.l-main-section
h2 Members
.l-sub-section
h3 onCheck
pre.prettyprint
code.
onCheck()
:markdown

View File

@ -1,27 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/interfaces.ts#L12-L17">angular2/src/core/compiler/interfaces.ts (line 12)</a>
:markdown
Defines lifecycle method [onDestroy] called when a directive is being destroyed.
.l-main-section
h2 Members
.l-sub-section
h3 onDestroy
pre.prettyprint
code.
onDestroy()
:markdown

View File

@ -1,27 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/interfaces.ts#L22-L27">angular2/src/core/compiler/interfaces.ts (line 22)</a>
:markdown
Defines lifecycle method [onInit] called when a directive is being checked the first time.
.l-main-section
h2 Members
.l-sub-section
h3 onInit
pre.prettyprint
code.
onInit()
:markdown

View File

@ -1,79 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/visibility.ts#L61-L110">angular2/src/core/annotations_impl/visibility.ts (line 61)</a>
:markdown
Specifies that an injector should retrieve a dependency from the direct parent.
## Example
Here is a simple directive that retrieves a dependency from its parent element.
```
@Directive({
selector: '[dependency]',
properties: [
'id: dependency'
]
})
class Dependency {
id:string;
}
@Directive({
selector: '[my-directive]'
})
class Dependency {
constructor(@Parent() dependency:Dependency) {
expect(dependency.id).toEqual(1);
};
}
```
We use this with the following HTML template:
```
<div dependency="1">
<div dependency="2" my-directive></div>
</div>
```
The `@Parent()` annotation in our constructor forces the injector to retrieve the dependency from
the
parent element (even thought the current element could resolve it): Angular injects
`dependency=1`.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({self}?: {self?: boolean})
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,23 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/view_ref.ts#L24-L31">angular2/src/core/compiler/view_ref.ts (line 24)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_protoView:AppProtoView)
:markdown

View File

@ -1,95 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/di.ts#L46-L71">angular2/src/core/annotations_impl/di.ts (line 46)</a>
:markdown
Specifies that a <a href='QueryList-class.html'><code>QueryList</code></a> should be injected.
See <a href='QueryList-class.html'><code>QueryList</code></a> for usage and example.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_selector: Type | string, {descendants = false}?: {descendants?: boolean})
:markdown
.l-sub-section
h3 descendants
:markdown
.l-sub-section
h3 selector
:markdown
.l-sub-section
h3 isVarBindingQuery
:markdown
.l-sub-section
h3 varBindings
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,128 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/query_list.ts#L1-L86">angular2/src/core/compiler/query_list.ts (line 1)</a>
:markdown
An iterable live list of components in the Light DOM.
Injectable Objects that contains a live list of child directives in the light DOM of a directive.
The directives are kept in depth-first pre-order traversal of the DOM.
The `QueryList` is iterable, therefore it can be used in both javascript code with `for..of` loop
as well as in
template with `*ng-for="of"` directive.
NOTE: In the future this class will implement an `Observable` interface. For now it uses a plain
list of observable
callbacks.
# Example:
Assume that `<tabs>` component would like to get a list its children which are `<pane>`
components as shown in this
example:
```html
<tabs>
<pane title="Overview">...</pane>
<pane *ng-for="#o of objects" [title]="o.title">{{o.text}}</pane>
</tabs>
```
In the above example the list of `<tabs>` elements needs to get a list of `<pane>` elements so
that it could render
tabs with the correct titles and in the correct order.
A possible solution would be for a `<pane>` to inject `<tabs>` component and then register itself
with `<tabs>`
component's on `hydrate` and deregister on `dehydrate` event. While a reasonable approach, this
would only work
partialy since `*ng-for` could rearrange the list of `<pane>` components which would not be
reported to `<tabs>`
component and thus the list of `<pane>` components would be out of sync with respect to the list
of `<pane>` elements.
A preferred solution is to inject a `QueryList` which is a live list of directives in the
component`s light DOM.
```javascript
@Component({
selector: 'tabs'
})
@View({
template: `
<ul>
<li *ng-for="#pane of panes">{{pane.title}}</li>
</ul>
<content></content>
`
})
class Tabs {
panes: QueryList<Pane>
constructor(@Query(Pane) panes:QueryList<Pane>) {
this.panes = panes;
}
}
@Component({
selector: 'pane',
properties: ['title']
})
@View(...)
class Pane {
title:string;
}
```
.l-main-section
h2 Members
.l-sub-section
h3 T
:markdown
.l-sub-section
h3 onChange
pre.prettyprint
code.
onChange(callback)
:markdown
.l-sub-section
h3 removeCallback
pre.prettyprint
code.
removeCallback(callback)
:markdown

View File

@ -1,73 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/visibility.ts#L15-L58">angular2/src/core/annotations_impl/visibility.ts (line 15)</a>
:markdown
Specifies that an injector should retrieve a dependency from its element.
## Example
Here is a simple directive that retrieves a dependency from its element.
```
@Directive({
selector: '[dependency]',
properties: [
'id: dependency'
]
})
class Dependency {
id:string;
}
@Directive({
selector: '[my-directive]'
})
class Dependency {
constructor(@Self() dependency:Dependency) {
expect(dependency.id).toEqual(1);
};
}
```
We use this with the following HTML template:
```
<div dependency="1" my-directive></div>
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor()
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,70 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/visibility.ts#L173-L213">angular2/src/core/annotations_impl/visibility.ts (line 173)</a>
:markdown
Specifies that an injector should retrieve a dependency from any ancestor element, crossing
component boundaries.
Use <a href='../annotations/Ancestor-var.html'><code>Ancestor</code></a> to look for ancestors within the current shadow boundary only.
## Example
Here is a simple directive that retrieves a dependency from an ancestor element.
```
@Directive({
selector: '[dependency]',
properties: [
'id: dependency'
]
})
class Dependency {
id:string;
}
@Directive({
selector: '[my-directive]'
})
class Dependency {
constructor(@Unbounded() dependency:Dependency) {
expect(dependency.id).toEqual(2);
};
}
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({self}?: {self?: boolean})
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,161 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/view.ts#L1-L104">angular2/src/core/annotations_impl/view.ts (line 1)</a>
:markdown
Declares the available HTML templates for an application.
Each angular component requires a single `@Component` and at least one `@View` annotation. The
`@View` annotation specifies the HTML template to use, and lists the directives that are active
within the template.
When a component is instantiated, the template is loaded into the component's shadow root, and
the expressions and statements in the template are evaluated against the component.
For details on the `@Component` annotation, see <a href='../annotations/Component-var.html'><code>Component</code></a>.
## Example
```
@Component({
selector: 'greet'
})
@View({
template: 'Hello {{name}}!',
directives: [GreetUser, Bold]
})
class Greet {
name: string;
constructor() {
this.name = 'World';
}
}
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({templateUrl, template, directives, renderer, styles, styleUrls}?: ViewArgs)
:markdown
.l-sub-section
h3 templateUrl
:markdown
Specifies a template URL for an angular component.
NOTE: either `templateUrl` or `template` should be used, but not both.
.l-sub-section
h3 template
:markdown
Specifies an inline template for an angular component.
NOTE: either `templateUrl` or `template` should be used, but not both.
.l-sub-section
h3 styleUrls
:markdown
Specifies stylesheet URLs for an angular component.
.l-sub-section
h3 styles
:markdown
Specifies an inline stylesheet for an angular component.
.l-sub-section
h3 directives
:markdown
Specifies a list of directives that can be used within a template.
Directives must be listed explicitly to provide proper component encapsulation.
```javascript
@Component({
selector: 'my-component'
})
@View({
directives: [For]
template: '
<ul>
<li *ng-for="#item of items">{{item}}</li>
</ul>'
})
class MyComponent {
}
```
.l-sub-section
h3 renderer
:markdown
Specify a custom renderer for this View.
If this is set, neither `template`, `templateUrl`, `styles`, `styleUrls` nor `directives` are
used.

View File

@ -1,87 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/annotations_impl/view.ts#L104-L112">angular2/src/core/annotations_impl/view.ts (line 104)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 templateUrl
:markdown
.l-sub-section
h3 template
:markdown
.l-sub-section
h3 directives
:markdown
.l-sub-section
h3 renderer
:markdown
.l-sub-section
h3 styles
:markdown
.l-sub-section
h3 styleUrls
:markdown

View File

@ -1,183 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/view_container_ref.ts#L9-L61">angular2/src/core/compiler/view_container_ref.ts (line 9)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(viewManager:AppViewManager, element: ElementRef)
:markdown
.l-sub-section
h3 viewManager
:markdown
.l-sub-section
h3 element
:markdown
.l-sub-section
h3 clear
pre.prettyprint
code.
clear()
:markdown
.l-sub-section
h3 get
pre.prettyprint
code.
get(index: number)
:markdown
.l-sub-section
h3 length
:markdown
.l-sub-section
h3 create
pre.prettyprint
code.
create(protoViewRef?: ProtoViewRef, atIndex?: number, context?: ElementRef, injector?: Injector)
:markdown
.l-sub-section
h3 insert
pre.prettyprint
code.
insert(viewRef: ViewRef, atIndex?: number)
:markdown
.l-sub-section
h3 indexOf
pre.prettyprint
code.
indexOf(viewRef: ViewRef)
:markdown
.l-sub-section
h3 remove
pre.prettyprint
code.
remove(atIndex?: number)
:markdown
.l-sub-section
h3 detach
pre.prettyprint
code.
detach(atIndex?: number)
:markdown
The method can be used together with insert to implement a view move, i.e.
moving the dom nodes while the directives in the view stay intact.

View File

@ -1,53 +0,0 @@
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/compiler/view_ref.ts#L13-L24">angular2/src/core/compiler/view_ref.ts (line 13)</a>
:markdown
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(_view:AppView)
:markdown
.l-sub-section
h3 render
:markdown
.l-sub-section
h3 setLocal
pre.prettyprint
code.
setLocal(contextName: string, value: any)
:markdown

View File

@ -1,118 +0,0 @@
{
"index" : {
"title" : "Core",
"intro" : "Define angular core API here."
},
"ViewRef-class" : {
"title" : "ViewRef Class"
},
"ProtoViewRef-class" : {
"title" : "ProtoViewRef Class"
},
"ViewContainerRef-class" : {
"title" : "ViewContainerRef Class"
},
"ElementRef-class" : {
"title" : "ElementRef Class"
},
"NgZone-class" : {
"title" : "NgZone Class"
},
"SelfAnnotation-class" : {
"title" : "SelfAnnotation Class"
},
"AncestorAnnotation-class" : {
"title" : "AncestorAnnotation Class"
},
"ParentAnnotation-class" : {
"title" : "ParentAnnotation Class"
},
"UnboundedAnnotation-class" : {
"title" : "UnboundedAnnotation Class"
},
"ViewAnnotation-class" : {
"title" : "ViewAnnotation Class"
},
"ViewArgs-interface" : {
"title" : "ViewArgs Interface"
},
"bootstrap-function" : {
"title" : "bootstrap Function"
},
"ApplicationRef-class" : {
"title" : "ApplicationRef Class"
},
"appComponentRefToken-var" : {
"title" : "appComponentRefToken Var"
},
"appComponentTypeToken-var" : {
"title" : "appComponentTypeToken Var"
},
"QueryAnnotation-class" : {
"title" : "QueryAnnotation Class"
},
"AttributeAnnotation-class" : {
"title" : "AttributeAnnotation Class"
},
"CompilerCache-class" : {
"title" : "CompilerCache Class"
},
"Compiler-class" : {
"title" : "Compiler Class"
},
"OnChange-interface" : {
"title" : "OnChange Interface"
},
"OnDestroy-interface" : {
"title" : "OnDestroy Interface"
},
"OnCheck-interface" : {
"title" : "OnCheck Interface"
},
"OnInit-interface" : {
"title" : "OnInit Interface"
},
"OnAllChangesDone-interface" : {
"title" : "OnAllChangesDone Interface"
},
"QueryList-class" : {
"title" : "QueryList Class"
},
"DirectiveResolver-class" : {
"title" : "DirectiveResolver Class"
},
"ComponentRef-class" : {
"title" : "ComponentRef Class"
},
"DynamicComponentLoader-class" : {
"title" : "DynamicComponentLoader Class"
}
}

View File

@ -1,11 +0,0 @@
.l-main-section
h2 appComponentRefToken <span class="type">variable</span>
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/application_tokens.ts#L3-L3">angular2/src/core/application_tokens.ts (line 3)</a>
:markdown

View File

@ -1,11 +0,0 @@
.l-main-section
h2 appComponentTypeToken <span class="type">variable</span>
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/application_tokens.ts#L4-L4">angular2/src/core/application_tokens.ts (line 4)</a>
:markdown

View File

@ -1,144 +0,0 @@
.l-main-section
h2(class="function export") bootstrap
pre.prettyprint
code.
bootstrap(appComponentType: Type, componentInjectableBindings?: List&lt;Type | Binding | List&lt;any&gt;&gt;, errorReporter?: Function) : Promise&lt;ApplicationRef&gt;
p.location-badge.
exported from <a href='../core'>angular2/core</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/core/application.ts#L156-L317">angular2/src/core/application.ts (line 156)</a>
:markdown
Bootstrapping for Angular applications.
You instantiate an Angular application by explicitly specifying a component to use as the root
component for your
application via the `bootstrap()` method.
## Simple Example
Assuming this `index.html`:
```html
<html>
<!-- load Angular script tags here. -->
<body>
<my-app>loading...</my-app>
</body>
</html>
```
An application is bootstrapped inside an existing browser DOM, typically `index.html`. Unlike
Angular 1, Angular 2
does not compile/process bindings in `index.html`. This is mainly for security reasons, as well
as architectural
changes in Angular 2. This means that `index.html` can safely be processed using server-side
technologies such as
bindings. Bindings can thus use double-curly `{{ syntax }}` without collision from Angular 2
component double-curly
`{{ syntax }}`.
We can use this script code:
```
@Component({
selector: 'my-app'
})
@View({
template: 'Hello {{ name }}!'
})
class MyApp {
name:string;
constructor() {
this.name = 'World';
}
}
main() {
return bootstrap(MyApp);
}
```
When the app developer invokes `bootstrap()` with the root component `MyApp` as its argument,
Angular performs the
following tasks:
1. It uses the component's `selector` property to locate the DOM element which needs to be
upgraded into
the angular component.
2. It creates a new child injector (from the platform injector) and configures the injector with
the component's
`appInjector`. Optionally, you can also override the injector configuration for an app by
invoking
`bootstrap` with the `componentInjectableBindings` argument.
3. It creates a new `Zone` and connects it to the angular application's change detection domain
instance.
4. It creates a shadow DOM on the selected component's host element and loads the template into
it.
5. It instantiates the specified component.
6. Finally, Angular performs change detection to apply the initial data bindings for the
application.
## Instantiating Multiple Applications on a Single Page
There are two ways to do this.
### Isolated Applications
Angular creates a new application each time that the `bootstrap()` method is invoked. When
multiple applications
are created for a page, Angular treats each application as independent within an isolated change
detection and
`Zone` domain. If you need to share data between applications, use the strategy described in the
next
section, "Applications That Share Change Detection."
### Applications That Share Change Detection
If you need to bootstrap multiple applications that share common data, the applications must
share a common
change detection and zone. To do that, create a meta-component that lists the application
components in its template.
By only invoking the `bootstrap()` method once, with the meta-component as its argument, you
ensure that only a
single change detection zone is created and therefore data can be shared across the applications.
## Platform Injector
When working within a browser window, there are many singleton resources: cookies, title,
location, and others.
Angular services that represent these resources must likewise be shared across all Angular
applications that
occupy the same browser window. For this reason, Angular creates exactly one global platform
injector which stores
all shared services, and each angular application injector has the platform injector as its
parent.
Each application has its own private injector as well. When there are multiple applications on a
page, Angular treats
each application injector's services as private to that application.
# API
- `appComponentType`: The root component which should act as the application. This is a reference
to a `Type`
which is annotated with `@Component(...)`.
- `componentInjectableBindings`: An additional set of bindings that can be added to `appInjector`
for the
<a href='../annotations/Component-var.html'><code>Component</code></a> to override default injection behavior.
- `errorReporter`: `function(exception:any, stackTrace:string)` a default error reporter for
unhandled exceptions.
Returns a `Promise` with the application`s private <a href='../di/Injector-class.html'><code>Injector</code></a>.

View File

@ -1,11 +0,0 @@
p.location-badge.
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/core.ts#L1-L23">angular2/core.ts (line 1)</a>
ul
for page, slug in public.docs[current.path[1]][current.path[2]][current.path[3]][current.path[4]]._data
if slug != 'index'
url = "/docs/" + current.path[1] + "/" + current.path[2] + "/" + current.path[3] + "/" + current.path[4] + "/" + slug + ".html"
li.c8
!= partial("../../../../../_includes/_hover-card", {name: page.title, url: url })

View File

@ -1,110 +0,0 @@
p.location-badge.
exported from <a href='../di'>angular2/di</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/di/exceptions.ts#L25-L53">angular2/src/di/exceptions.ts (line 25)</a>
:markdown
Base class for all errors arising from misconfigured bindings.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(key, constructResolvingMessage: Function)
:markdown
.l-sub-section
h3 name
:markdown
.l-sub-section
h3 message
:markdown
.l-sub-section
h3 keys
:markdown
.l-sub-section
h3 constructResolvingMessage
:markdown
.l-sub-section
h3 addKey
pre.prettyprint
code.
addKey(key)
:markdown
.l-sub-section
h3 toString
pre.prettyprint
code.
toString()
:markdown

View File

@ -1,43 +0,0 @@
p.location-badge.
exported from <a href='../di'>angular2/di</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/di/exceptions.ts#L69-L103">angular2/src/di/exceptions.ts (line 69)</a>
:markdown
Thrown when trying to retrieve an async <a href='Binding-class.html'><code>Binding</code></a> using the sync API.
## Example
```javascript
var injector = Injector.resolveAndCreate([
bind(Number).toAsyncFactory(() => {
return new Promise((resolve) => resolve(1 + 2));
}),
bind(String).toFactory((v) => { return "Value: " + v; }, [String])
]);
injector.asyncGet(String).then((v) => expect(v).toBe('Value: 3'));
expect(() => {
injector.get(String);
}).toThrowError(AsycBindingError);
```
The above example throws because `String` depends on `Number` which is async. If any binding in
the dependency graph is async then the graph can only be retrieved using the `asyncGet` API.
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(key)
:markdown

View File

@ -1,278 +0,0 @@
p.location-badge.
exported from <a href='../di'>angular2/di</a>
defined in <a href="https://github.com/angular/angular/tree/3a0410a/modules/angular2/src/di/binding.ts#L34-L255">angular2/src/di/binding.ts (line 34)</a>
:markdown
Describes how the <a href='Injector-class.html'><code>Injector</code></a> should instantiate a given token.
See <a href='bind-function.html'><code>bind</code></a>.
## Example
```javascript
var injector = Injector.resolveAndCreate([
new Binding(String, { toValue: 'Hello' })
]);
expect(injector.get(String)).toEqual('Hello');
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor(token, {toClass, toValue, toAlias, toFactory, toAsyncFactory, deps}: {
toClass?: Type,
toValue?: any,
toAlias?: any,
toFactory?: Function,
toAsyncFactory?: Function,
deps?: List&lt;any&gt;
})
:markdown
.l-sub-section
h3 token
:markdown
Token used when retrieving this binding. Usually the `Type`.
.l-sub-section
h3 toClass
:markdown
Binds an interface to an implementation / subclass.
Becuse `toAlias` and `toClass` are often confused, the example contains both use cases for easy
comparison.
```javascript
class Vehicle {}
class Car extends Vehicle {}
var injectorClass = Injector.resolveAndCreate([
Car,
new Binding(Vehicle, { toClass: Car })
]);
var injectorAlias = Injector.resolveAndCreate([
Car,
new Binding(Vehicle, { toAlias: Car })
]);
expect(injectorClass.get(Vehicle)).not.toBe(injectorClass.get(Car));
expect(injectorClass.get(Vehicle) instanceof Car).toBe(true);
expect(injectorAlias.get(Vehicle)).toBe(injectorAlias.get(Car));
expect(injectorAlias.get(Vehicle) instanceof Car).toBe(true);
```
.l-sub-section
h3 toValue
:markdown
Binds a key to a value.
```javascript
var injector = Injector.resolveAndCreate([
new Binding(String, { toValue: 'Hello' })
]);
expect(injector.get(String)).toEqual('Hello');
```
.l-sub-section
h3 toAlias
:markdown
Binds a key to the alias for an existing key.
An alias means that <a href='Injector-class.html'><code>Injector</code></a> returns the same instance as if the alias token was used.
This is in contrast to `toClass` where a separate instance of `toClass` is returned.
Becuse `toAlias` and `toClass` are often confused the example contains both use cases for easy
comparison.
```javascript
class Vehicle {}
class Car extends Vehicle {}
var injectorAlias = Injector.resolveAndCreate([
Car,
new Binding(Vehicle, { toAlias: Car })
]);
var injectorClass = Injector.resolveAndCreate([
Car,
new Binding(Vehicle, { toClass: Car })
]);
expect(injectorAlias.get(Vehicle)).toBe(injectorAlias.get(Car));
expect(injectorAlias.get(Vehicle) instanceof Car).toBe(true);
expect(injectorClass.get(Vehicle)).not.toBe(injectorClass.get(Car));
expect(injectorClass.get(Vehicle) instanceof Car).toBe(true);
```
.l-sub-section
h3 toFactory
:markdown
Binds a key to a function which computes the value.
```javascript
var injector = Injector.resolveAndCreate([
new Binding(Number, { toFactory: () => { return 1+2; }}),
new Binding(String, { toFactory: (value) => { return "Value: " + value; },
dependencies: [Number] })
]);
expect(injector.get(Number)).toEqual(3);
expect(injector.get(String)).toEqual('Value: 3');
```
.l-sub-section
h3 toAsyncFactory
:markdown
Binds a key to a function which computes the value asynchronously.
```javascript
var injector = Injector.resolveAndCreate([
new Binding(Number, { toAsyncFactory: () => {
return new Promise((resolve) => resolve(1 + 2));
}}),
new Binding(String, { toFactory: (value) => { return "Value: " + value; },
dependencies: [Number]})
]);
injector.asyncGet(Number).then((v) => expect(v).toBe(3));
injector.asyncGet(String).then((v) => expect(v).toBe('Value: 3'));
```
The interesting thing to note is that event though `Number` has an async factory, the `String`
factory function takes the resolved value. This shows that the <a href='Injector-class.html'><code>Injector</code></a> delays
executing the
`String` factory
until after the `Number` is resolved. This can only be done if the `token` is retrieved using
the `asyncGet` API in the <a href='Injector-class.html'><code>Injector</code></a>.
.l-sub-section
h3 dependencies
:markdown
Used in conjunction with `toFactory` or `toAsyncFactory` and specifies a set of dependencies
(as `token`s) which should be injected into the factory function.
```javascript
var injector = Injector.resolveAndCreate([
new Binding(Number, { toFactory: () => { return 1+2; }}),
new Binding(String, { toFactory: (value) => { return "Value: " + value; },
dependencies: [Number] })
]);
expect(injector.get(Number)).toEqual(3);
expect(injector.get(String)).toEqual('Value: 3');
```
.l-sub-section
h3 resolve
pre.prettyprint
code.
resolve()
:markdown
Converts the <a href='Binding-class.html'><code>Binding</code></a> into <a href='ResolvedBinding-class.html'><code>ResolvedBinding</code></a>.
<a href='Injector-class.html'><code>Injector</code></a> internally only uses <a href='ResolvedBinding-class.html'><code>ResolvedBinding</code></a>, <a href='Binding-class.html'><code>Binding</code></a> contains
convenience binding syntax.

Some files were not shown because too many files have changed in this diff Show More