iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(core): rename ViewContainer to ViewContainerRef 

This also renames InternalAppViewContainer into AppViewContainer

Related to #1477
Closes #1554
This commit is contained in:
Tobias Bosch 2015-04-27 09:26:55 -07:00
parent 0676fef61f
commit 6dece68bb8
22 changed files with 145 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
modules/angular2/core.js vendored
View File

@ -23,7 +23,7 @@ export * from './src/render/dom/shadow_dom/emulated_unscoped_shadow_dom_strategy
export * from './src/core/compiler/dynamic_component_loader'; export * from './src/core/compiler/dynamic_component_loader';
export {ElementRef, ComponentRef} from './src/core/compiler/element_injector'; export {ElementRef, ComponentRef} from './src/core/compiler/element_injector';
export * from './src/core/compiler/view'; export * from './src/core/compiler/view';
export * from './src/core/compiler/view_container'; export * from './src/core/compiler/view_container_ref';
export * from './src/core/compiler/ng_element'; export * from './src/core/compiler/ng_element';

60
modules/angular2/docs/core/02_directives.md
View File

@ -6,7 +6,7 @@ Directives are the cornerstone of an Angular application. We use Directives to b
Angular applications do not have a main method. Instead they have a root Component. Dependency Injection then assembles the directives into a working Angular application. Angular applications do not have a main method. Instead they have a root Component. Dependency Injection then assembles the directives into a working Angular application.
There are three different kinds of directives (described in more detail in later sections). There are three different kinds of directives (described in more detail in later sections).
1. *Decorators*: can be placed on any DOM element and can be combined with other directives. 1. *Decorators*: can be placed on any DOM element and can be combined with other directives.
2. *Components*: Components have an encapsulated view and can configure injectors. 2. *Components*: Components have an encapsulated view and can configure injectors.
@ -16,7 +16,7 @@ There are three different kinds of directives (described in more detail in later
## CSS Selectors ## CSS Selectors
Directives are instantiated whenever the CSS selector matches the DOM structure. Directives are instantiated whenever the CSS selector matches the DOM structure.
Angular supports these CSS selector constructs: Angular supports these CSS selector constructs:
* Element name: `name` * Element name: `name`
@ -29,7 +29,7 @@ Angular supports these CSS selector constructs:
Angular does not support these (and any CSS selector which crosses element boundaries): Angular does not support these (and any CSS selector which crosses element boundaries):
* Descendant: `body div` * Descendant: `body div`
* Direct descendant: `body > div` * Direct descendant: `body > div`
* Adjacent: `div + table` * Adjacent: `div + table`
* Sibling: `div ~ table` * Sibling: `div ~ table`
* Wildcard: `*` * Wildcard: `*`
@ -68,10 +68,10 @@ Here is a trivial example of a tooltip decorator. The directive will log a toolt
@Decorator({ @Decorator({
selector: '[tooltip]', // CSS Selector which triggers the decorator selector: '[tooltip]', // CSS Selector which triggers the decorator
properties: { // List which properties need to be bound properties: { // List which properties need to be bound
text: 'tooltip' // - DOM element tooltip property should be text: 'tooltip' // - DOM element tooltip property should be
}, // mapped to the directive text property. }, // mapped to the directive text property.
hostListeners: { // List which events need to be mapped. hostListeners: { // List which events need to be mapped.
mouseover: 'show' // - Invoke the show() method every time mouseover: 'show' // - Invoke the show() method every time
} // the mouseover event is fired. } // the mouseover event is fired.
}) })
class Form { // Directive controller class, instantiated class Form { // Directive controller class, instantiated
@ -121,14 +121,14 @@ Example of a component:
templateUrl: 'pane.html' | - URL of template HTML templateUrl: 'pane.html' | - URL of template HTML
}) | }) |
class Pane { | Component controller class class Pane { | Component controller class
title:string; | - title property title:string; | - title property
open:boolean; open:boolean;
constructor() { constructor() {
this.title = ''; this.title = '';
this.open = true; this.open = true;
} }
// Public API // Public API
toggle() => this.open = !this.open; toggle() => this.open = !this.open;
open() => this.open = true; open() => this.open = true;
@ -165,12 +165,12 @@ Example of usage:
## Viewport ## Viewport
Viewport is a directive which can control instantiation of child views which are then inserted into the DOM. (Examples are `if` and `for`.) Viewport is a directive which can control instantiation of child views which are then inserted into the DOM. (Examples are `if` and `for`.)
* Viewports can only be placed on `<template>` elements (or the short hand version which uses `<element template>` attribute.) * Viewports can only be placed on `<template>` elements (or the short hand version which uses `<element template>` attribute.)
* Only one viewport can be present per DOM template element. * Only one viewport can be present per DOM template element.
* The viewport is created over the `template` element. This is known as the `ViewContainer`. * The viewport is created over the `template` element. This is known as the `ViewContainerRef`.
* Viewport can insert child views into the `ViewContainer`. The child views show up as siblings of the `Viewport` in the DOM. * Viewport can insert child views into the `ViewContainerRef`. The child views show up as siblings of the `Viewport` in the DOM.
>> TODO(misko): Relationship with Injection >> TODO(misko): Relationship with Injection
>> TODO(misko): Instantiator can not be injected into child Views >> TODO(misko): Instantiator can not be injected into child Views
@ -184,10 +184,10 @@ Viewport is a directive which can control instantiation of child views which are
} }
}) })
export class If { export class If {
viewContainer: ViewContainer; viewContainer: ViewContainerRef;
view: View; view: View;
constructor(viewContainer: ViewContainer) { constructor(viewContainer: ViewContainerRef) {
this.viewContainer = viewContainer; this.viewContainer = viewContainer;
this.view = null; this.view = null;
} }
@ -220,30 +220,30 @@ To better understand the kinds of injections which are supported in Angular we h
### Injecting Services ### Injecting Services
Service injection is the most straight forward kind of injection which Angular supports. It involves a component configuring the `injectables` and then letting the directive ask for the configured service. Service injection is the most straight forward kind of injection which Angular supports. It involves a component configuring the `injectables` and then letting the directive ask for the configured service.
This example illustrates how to inject `MyService` into `House` directive. This example illustrates how to inject `MyService` into `House` directive.
``` ```
class MyService {} | Assume a service which needs to be injected class MyService {} | Assume a service which needs to be injected
| into a directive. | into a directive.
| |
@Component({ | Assume a top level application component which @Component({ | Assume a top level application component which
selector: 'my-app', | configures the services to be injected. selector: 'my-app', | configures the services to be injected.
injectables: [MyService] | injectables: [MyService] |
}) | }) |
@View({ | Assume we have a template that needs to be @View({ | Assume we have a template that needs to be
templateUrl: 'my_app.html', | configured with directives to be injected. templateUrl: 'my_app.html', | configured with directives to be injected.
directives: [House] | directives: [House] |
}) | }) |
class MyApp {} | class MyApp {} |
| |
@Decorator({ | This is the directive into which we would like @Decorator({ | This is the directive into which we would like
selector: '[house]' | to inject the MyService. selector: '[house]' | to inject the MyService.
}) | }) |
class House { | class House { |
constructor(myService:MyService) { | Notice that in the constructor we can simply constructor(myService:MyService) { | Notice that in the constructor we can simply
} | ask for MyService. } | ask for MyService.
} | } |
@ -252,7 +252,7 @@ class House { |
Assume the following DOM structure for `my_app.html`: Assume the following DOM structure for `my_app.html`:
``` ```
<div house> | The house attribute triggers the creation of the House directive. <div house> | The house attribute triggers the creation of the House directive.
</div> | This is equivalent to: </div> | This is equivalent to:
| new House(injector.get(MyService)); | new House(injector.get(MyService));
``` ```
@ -264,7 +264,7 @@ Injecting other directives into directives follows a similar mechanism as inject
There are five kinds of visibilities: There are five kinds of visibilities:
* (no annotation): Inject dependant directives only if they are on the current element. * (no annotation): Inject dependant directives only if they are on the current element.
* `@ancestor`: Inject a directive if it is at any element above the current element. * `@ancestor`: Inject a directive if it is at any element above the current element.
* `@parent`: Inject a directive which is direct parent of the current element. * `@parent`: Inject a directive which is direct parent of the current element.
* `@child`: Inject a list of direct children which match a given type. (Used with `Query`) * `@child`: Inject a list of direct children which match a given type. (Used with `Query`)
@ -278,8 +278,8 @@ Here is an example of the kinds of injections which can be achieved:
``` ```
@Component({ | @Component({ |
selector: 'my-app' | selector: 'my-app' |
}) | }) |
@View({ | @View({ |
templateUrl: 'my_app.html', | templateUrl: 'my_app.html', |
directives: [Form, FieldSet, | directives: [Form, FieldSet, |
Field, Primary] | Field, Primary] |
@ -290,15 +290,15 @@ class MyApp {} |
class Form { | class Form { |
constructor( | constructor( |
@descendant sets:Query<FieldSet> | @descendant sets:Query<FieldSet> |
) { | ) { |
} | } |
} | } |
| |
@Decorator({ selector: 'fieldset' }) | @Decorator({ selector: 'fieldset' }) |
class FieldSet { | class FieldSet { |
constructor( | constructor( |
@child sets:Query<Field> | @child sets:Query<Field> |
) { ... } | ) { ... } |
} | } |
| |
@Decorator({ selector: 'field' }) | @Decorator({ selector: 'field' }) |
@ -306,12 +306,12 @@ class Field { |
constructor( | constructor( |
@ancestor field:Form, | @ancestor field:Form, |
@parent field:FieldSet, | @parent field:FieldSet, |
) { ... } | ) { ... } |
} | } |
| |
@Decorator({ selector: '[primary]'}) | @Decorator({ selector: '[primary]'}) |
class Primary { | class Primary { |
constructor(field:Field ) { ... } | constructor(field:Field ) { ... } |
} | } |
``` ```
@ -324,7 +324,7 @@ Assume the following DOM structure for `my_app.html`:
<field></field> | <field></field> |
</fieldset> | </fieldset> |
</div> | </div> |
</form> | </form> |
``` ```

78
modules/angular2/docs/core/10_view.md
View File

@ -2,24 +2,24 @@
## Overview ## Overview
This document explains the concept of a View. This document explains the concept of a View.
A View is a core primitive used by angular to render the DOM tree. A View is a core primitive used by angular to render the DOM tree.
A ViewPort is location in a View which can accept child Views. A ViewPort is location in a View which can accept child Views.
Every ViewPort has an associated ViewContainer than can contain any number of child Views. Every ViewPort has an associated ViewContainerRef than can contain any number of child Views.
Views form a tree structure which mimics the DOM tree. Views form a tree structure which mimics the DOM tree.
* View is a core rendering construct. A running application is just a collection of Views which are * View is a core rendering construct. A running application is just a collection of Views which are
nested in a tree like structure. The View tree is a simplified version of the DOM tree. A View can nested in a tree like structure. The View tree is a simplified version of the DOM tree. A View can
have a single DOM Element or large DOM structures. The key is that the DOM tree in the View can have a single DOM Element or large DOM structures. The key is that the DOM tree in the View can
not undergo structural changes (only property changes). not undergo structural changes (only property changes).
* Views represent a running instance of a DOM View. This implies that while elements in a View * Views represent a running instance of a DOM View. This implies that while elements in a View
can change properties, they can not change structurally. (Structural changes such as, adding or can change properties, they can not change structurally. (Structural changes such as, adding or
removing elements requires adding or removing child Views into ViewContainers). removing elements requires adding or removing child Views into ViewContainers).
* View can have zero or more ViewPorts. A ViewPort is a marker in the DOM which allows * View can have zero or more ViewPorts. A ViewPort is a marker in the DOM which allows
the insertion of child Views. the insertion of child Views.
* Views are created from a ProtoView. A ProtoView is a compiled DOM View which is efficient at * Views are created from a ProtoView. A ProtoView is a compiled DOM View which is efficient at
creating Views. creating Views.
* View contains a context object. The context represents the object instance against which all * View contains a context object. The context represents the object instance against which all
expressions are evaluated. expressions are evaluated.
* View contains a ChangeDetector for looking for detecting changes to the model. * View contains a ChangeDetector for looking for detecting changes to the model.
* View contains ElementInjector for creating Directives. * View contains ElementInjector for creating Directives.
@ -51,9 +51,9 @@ And assume following HTML View:
</div> </div>
``` ```
The above template is compiled by the Compiler to create a ProtoView. The ProtoView is then used to The above template is compiled by the Compiler to create a ProtoView. The ProtoView is then used to
create an instance of the View. The instantiation process involves cloning the above template and create an instance of the View. The instantiation process involves cloning the above template and
locating all of the elements which contain bindings and finally instantiating the Directives locating all of the elements which contain bindings and finally instantiating the Directives
associated with the template. (See compilation for more details.) associated with the template. (See compilation for more details.)
``` ```
@ -81,13 +81,13 @@ Note:
* View knows which expressions need to be watched. * View knows which expressions need to be watched.
* View knows what needs to be updated if the watched expression changes. * View knows what needs to be updated if the watched expression changes.
* All DOM elements are owned by single instance of the view. * All DOM elements are owned by single instance of the view.
* The structure of the DOM can not change during runtime. To allow structural changes to the DOM we need * The structure of the DOM can not change during runtime. To allow structural changes to the DOM we need
to understand Composed View. to understand Composed View.
## Composed View ## Composed View
An important part of an application is to be able to change the DOM structure to render data for the An important part of an application is to be able to change the DOM structure to render data for the
user. In Angular this is done by inserting child views into the ViewPort. user. In Angular this is done by inserting child views into the ViewPort.
Let's start with a View such as: Let's start with a View such as:
@ -123,12 +123,12 @@ The next step is to compose these two ProtoViews into an actual view which is re
</ul> | viewA(someContext) </ul> | viewA(someContext)
``` ```
*Step2:* Instantiate `Foreach` directive which will receive the `ViewContainer`. (The ViewContainer *Step2:* Instantiate `Foreach` directive which will receive the `ViewContainerRef`. (The ViewContainerRef
has a reference to `protoViewA`). has a reference to `protoViewA`).
*Step3:* As the `Foreach` directive unrolls it asks the `ViewContainer` to instantiate `protoViewB` and insert *Step3:* As the `Foreach` directive unrolls it asks the `ViewContainerRef` to instantiate `protoViewB` and insert
it after the `ViewPort` anchor. This is repeated for each `person` in `people`. Notice that it after the `ViewPort` anchor. This is repeated for each `person` in `people`. Notice that
``` ```
<ul> | viewA(someContext) <ul> | viewA(someContext)
@ -138,9 +138,9 @@ it after the `ViewPort` anchor. This is repeated for each `person` in `people`.
</ul> | viewA(someContext) </ul> | viewA(someContext)
``` ```
*Step4:* All of the bindings in the child Views are updated. Notice that in the case of `Foreach` *Step4:* All of the bindings in the child Views are updated. Notice that in the case of `Foreach`
the evaluation context for the `viewB0` and `viewB1` are `locals0` and `locals1` respectively. the evaluation context for the `viewB0` and `viewB1` are `locals0` and `locals1` respectively.
Locals allow the introduction of new local variables visible only within the scope of the View, and Locals allow the introduction of new local variables visible only within the scope of the View, and
delegate any unknown references to the parent context. delegate any unknown references to the parent context.
``` ```
@ -151,17 +151,17 @@ delegate any unknown references to the parent context.
</ul> | viewA </ul> | viewA
``` ```
Each View can have zero or more ViewPorts. By inserting and removing child Views to and from the Each View can have zero or more ViewPorts. By inserting and removing child Views to and from the
ViewContainers, the application can mutate the DOM structure to any desirable state. A View may contain ViewContainers, the application can mutate the DOM structure to any desirable state. A View may contain
individual nodes or a complex DOM structure. The insertion points for the child Views, known as individual nodes or a complex DOM structure. The insertion points for the child Views, known as
ViewContainers, contain a DOM element which acts as an anchor. The anchor is either a `template` or ViewContainers, contain a DOM element which acts as an anchor. The anchor is either a `template` or
a `script` element depending on your browser. It is used to identify where the child Views will be a `script` element depending on your browser. It is used to identify where the child Views will be
inserted. inserted.
## Component Views ## Component Views
A View can also contain Components. Components contain Shadow DOM for encapsulating their internal A View can also contain Components. Components contain Shadow DOM for encapsulating their internal
rendering state. Unlike ViewPorts which can contain zero or more Views, the Component always contains rendering state. Unlike ViewPorts which can contain zero or more Views, the Component always contains
exactly one Shadow View. exactly one Shadow View.
``` ```
@ -205,7 +205,7 @@ And assume the following HTML View:
</div> | viewA(greeter) </div> | viewA(greeter)
``` ```
The above UI is built using a single View, and hence a single context `greeter`. It can be expressed The above UI is built using a single View, and hence a single context `greeter`. It can be expressed
in this pseudo-code. in this pseudo-code.
``` ```
@ -215,15 +215,15 @@ var greeter = new Greeter();
The View contains two bindings: The View contains two bindings:
1. `greeting`: This is bound to the `greeting` property on the `Greeter` instance. 1. `greeting`: This is bound to the `greeting` property on the `Greeter` instance.
2. `name.value`: This poses a problem. There is no `name` property on the `Greeter` instance. To solve 2. `name.value`: This poses a problem. There is no `name` property on the `Greeter` instance. To solve
this we wrap the `Greeter` instance in the `Local` instance like so: this we wrap the `Greeter` instance in the `Local` instance like so:
``` ```
var greeter = new Locals(new Greeter(), {name: ref_to_input_element }) var greeter = new Locals(new Greeter(), {name: ref_to_input_element })
``` ```
By wrapping the `Greeter` instance into the `Locals` we allow the view to introduce variables which By wrapping the `Greeter` instance into the `Locals` we allow the view to introduce variables which
are in addition to the `Greeter` instance. During the resolution of the expressions we first check are in addition to the `Greeter` instance. During the resolution of the expressions we first check
the locals, and then the `Greeter` instance. the locals, and then the `Greeter` instance.
@ -233,14 +233,14 @@ the locals, and then the `Greeter` instance.
Views transition through a particular set of states: Views transition through a particular set of states:
1. View is created from the ProtoView. 1. View is created from the ProtoView.
2. View can be attached to an existing ViewContainer. 2. View can be attached to an existing ViewContainerRef.
3. Upon attaching View to the ViewContainer the View needs to be hydrated. The hydration process 3. Upon attaching View to the ViewContainerRef the View needs to be hydrated. The hydration process
involves instantiating all of the Directives associated with the current View. involves instantiating all of the Directives associated with the current View.
4. At this point the view is ready and renderable. Multiple changes can be delivered to the 4. At this point the view is ready and renderable. Multiple changes can be delivered to the
Directives from the ChangeDetection. Directives from the ChangeDetection.
5. At some point the View can be removed. At this point all of the directives are destroyed during 5. At some point the View can be removed. At this point all of the directives are destroyed during
the dehydration process and the view becomes inactive. the dehydration process and the view becomes inactive.
6. The View has to wait until it is detached from the DOM. The delay in detaching could be caused 6. The View has to wait until it is detached from the DOM. The delay in detaching could be caused
because an animation is animating the view away. because an animation is animating the view away.
7. After the View is detached from the DOM it is ready to be reused. The view reuse allows the 7. After the View is detached from the DOM it is ready to be reused. The view reuse allows the
application to be faster in subsequent renderings. application to be faster in subsequent renderings.

10
modules/angular2/src/core/annotations/annotations.js vendored
View File

@ -55,7 +55,7 @@ import {DEFAULT} from 'angular2/change_detection';
* *
* To inject element-specific special objects, declare the constructor parameter as: * To inject element-specific special objects, declare the constructor parameter as:
* - `element: NgElement` to obtain a DOM element (DEPRECATED: replacement coming) * - `element: NgElement` to obtain a DOM element (DEPRECATED: replacement coming)
* - `viewContainer: ViewContainer` to control child template instantiation, for {@link Viewport} directives only * - `viewContainer: ViewContainerRef` to control child template instantiation, for {@link Viewport} directives only
* - `bindingPropagation: BindingPropagation` to control change detection in a more granular way. * - `bindingPropagation: BindingPropagation` to control change detection in a more granular way.
* *
* ## Example * ## Example
@ -827,8 +827,8 @@ export class Decorator extends Directive {
/** /**
* Directive that controls the instantiation, destruction, and positioning of inline template elements. * Directive that controls the instantiation, destruction, and positioning of inline template elements.
* *
* A viewport directive uses a {@link ViewContainer} to instantiate, insert, move, and destroy views at runtime. * A viewport directive uses a {@link ViewContainerRef} to instantiate, insert, move, and destroy views at runtime.
* The {@link ViewContainer} is created as a result of `<template>` element, and represents a location in the current view * The {@link ViewContainerRef} is created as a result of `<template>` element, and represents a location in the current view
* where these actions are performed. * where these actions are performed.
* *
* Views are always created as children of the current {@link View}, and as siblings of the `<template>` element. Thus a * Views are always created as children of the current {@link View}, and as siblings of the `<template>` element. Thus a
@ -873,10 +873,10 @@ export class Decorator extends Directive {
* } * }
* }) * })
* export class Unless { * export class Unless {
* viewContainer: ViewContainer; * viewContainer: ViewContainerRef;
* prevCondition: boolean; * prevCondition: boolean;
* *
* constructor(viewContainer: ViewContainer) { * constructor(viewContainer: ViewContainerRef) {
* this.viewContainer = viewContainer; * this.viewContainer = viewContainer;
* this.prevCondition = null; * this.prevCondition = null;
* } * }

8
modules/angular2/src/core/compiler/element_injector.js vendored
View File

@ -8,7 +8,7 @@ import {Parent, Ancestor} from 'angular2/src/core/annotations/visibility';
import {Attribute, Query} from 'angular2/src/core/annotations/di'; import {Attribute, Query} from 'angular2/src/core/annotations/di';
import * as viewModule from 'angular2/src/core/compiler/view'; import * as viewModule from 'angular2/src/core/compiler/view';
import * as avmModule from './view_manager'; import * as avmModule from './view_manager';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {NgElement} from 'angular2/src/core/compiler/ng_element'; import {NgElement} from 'angular2/src/core/compiler/ng_element';
import {Directive, Component, onChange, onDestroy, onAllChangesDone} from 'angular2/src/core/annotations/annotations'; import {Directive, Component, onChange, onDestroy, onAllChangesDone} from 'angular2/src/core/annotations/annotations';
import {ChangeDetector, ChangeDetectorRef} from 'angular2/change_detection'; import {ChangeDetector, ChangeDetectorRef} from 'angular2/change_detection';
@ -31,14 +31,14 @@ export class ElementRef {
boundElementIndex:number; boundElementIndex:number;
injector:Injector; injector:Injector;
elementInjector:ElementInjector; elementInjector:ElementInjector;
viewContainer:ViewContainer; viewContainer:ViewContainerRef;
constructor(elementInjector, hostView, boundElementIndex, injector, viewManager, defaultProtoView){ constructor(elementInjector, hostView, boundElementIndex, injector, viewManager, defaultProtoView){
this.elementInjector = elementInjector; this.elementInjector = elementInjector;
this.hostView = hostView; this.hostView = hostView;
this.boundElementIndex = boundElementIndex; this.boundElementIndex = boundElementIndex;
this.injector = injector; this.injector = injector;
this.viewContainer = new ViewContainer(viewManager, this, defaultProtoView); this.viewContainer = new ViewContainerRef(viewManager, this, defaultProtoView);
} }
} }
@ -57,7 +57,7 @@ class StaticKeys {
this.defaultProtoViewId = Key.get(viewModule.AppProtoView).id; this.defaultProtoViewId = Key.get(viewModule.AppProtoView).id;
this.viewId = Key.get(viewModule.AppView).id; this.viewId = Key.get(viewModule.AppView).id;
this.ngElementId = Key.get(NgElement).id; this.ngElementId = Key.get(NgElement).id;
this.viewContainerId = Key.get(ViewContainer).id; this.viewContainerId = Key.get(ViewContainerRef).id;
this.changeDetectorRefId = Key.get(ChangeDetectorRef).id; this.changeDetectorRefId = Key.get(ChangeDetectorRef).id;
this.elementRefId = Key.get(ElementRef).id; this.elementRefId = Key.get(ElementRef).id;
} }

6
modules/angular2/src/core/compiler/view.js vendored
View File

@ -8,9 +8,7 @@ import {SetterFn} from 'angular2/src/reflection/types';
import {IMPLEMENTS, int, isPresent, isBlank, BaseException} from 'angular2/src/facade/lang'; import {IMPLEMENTS, int, isPresent, isBlank, BaseException} from 'angular2/src/facade/lang';
import * as renderApi from 'angular2/src/render/api'; import * as renderApi from 'angular2/src/render/api';
// TODO(tbosch): rename ViewContainer -> ViewContainerRef export class AppViewContainer {
// and InternalAppViewContainer -> ViewContainer!
export class InternalAppViewContainer {
views: List<AppView>; views: List<AppView>;
constructor() { constructor() {
@ -36,7 +34,7 @@ export class AppView {
/// Host views that were added by an imperative view. /// Host views that were added by an imperative view.
/// This is a dynamically growing / shrinking array. /// This is a dynamically growing / shrinking array.
imperativeHostViews: List<AppView>; imperativeHostViews: List<AppView>;
viewContainers: List<InternalAppViewContainer>; viewContainers: List<AppViewContainer>;
preBuiltObjects: List<PreBuiltObjects>; preBuiltObjects: List<PreBuiltObjects>;
proto: AppProtoView; proto: AppProtoView;
renderer: renderApi.Renderer; renderer: renderApi.Renderer;

2
modules/angular2/src/core/compiler/view_container.js → modules/angular2/src/core/compiler/view_container_ref.js vendored
View File

@ -9,7 +9,7 @@ import * as avmModule from './view_manager';
/** /**
* @exportedAs angular2/view * @exportedAs angular2/view
*/ */
export class ViewContainer { export class ViewContainerRef {
_viewManager: avmModule.AppViewManager; _viewManager: avmModule.AppViewManager;
_location: eiModule.ElementRef; _location: eiModule.ElementRef;
_defaultProtoView: viewModule.AppProtoView; _defaultProtoView: viewModule.AppProtoView;

4
modules/angular2/src/core/compiler/view_manager.js vendored
View File

@ -3,7 +3,7 @@ import {ListWrapper, MapWrapper, Map, StringMapWrapper, List} from 'angular2/src
import {isPresent, isBlank, BaseException} from 'angular2/src/facade/lang'; import {isPresent, isBlank, BaseException} from 'angular2/src/facade/lang';
import * as eli from './element_injector'; import * as eli from './element_injector';
import * as viewModule from './view'; import * as viewModule from './view';
import {Renderer, ViewRef, ViewContainerRef} from 'angular2/src/render/api'; import {Renderer, ViewRef, RenderViewContainerRef} from 'angular2/src/render/api';
import {AppViewManagerUtils} from './view_manager_utils'; import {AppViewManagerUtils} from './view_manager_utils';
import {AppViewPool} from './view_pool'; import {AppViewPool} from './view_pool';
@ -121,7 +121,7 @@ export class AppViewManager {
} }
_getRenderViewContainerRef(parentView:viewModule.AppView, boundElementIndex:number) { _getRenderViewContainerRef(parentView:viewModule.AppView, boundElementIndex:number) {
return new ViewContainerRef(parentView.render, boundElementIndex); return new RenderViewContainerRef(parentView.render, boundElementIndex);
} }
_createViewRecurse(protoView:viewModule.AppProtoView) { _createViewRecurse(protoView:viewModule.AppProtoView) {

2
modules/angular2/src/core/compiler/view_manager_utils.js vendored
View File

@ -112,7 +112,7 @@ export class AppViewManagerUtils {
parentView.changeDetector.addChild(view.changeDetector); parentView.changeDetector.addChild(view.changeDetector);
var viewContainer = parentView.viewContainers[boundElementIndex]; var viewContainer = parentView.viewContainers[boundElementIndex];
if (isBlank(viewContainer)) { if (isBlank(viewContainer)) {
viewContainer = new viewModule.InternalAppViewContainer(); viewContainer = new viewModule.AppViewContainer();
parentView.viewContainers[boundElementIndex] = viewContainer; parentView.viewContainers[boundElementIndex] = viewContainer;
} }
ListWrapper.insert(viewContainer.views, atIndex, view); ListWrapper.insert(viewContainer.views, atIndex, view);

6
modules/angular2/src/directives/for.js vendored
View File

@ -1,5 +1,5 @@
import {Viewport} from 'angular2/src/core/annotations/annotations'; import {Viewport} from 'angular2/src/core/annotations/annotations';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {AppView} from 'angular2/src/core/compiler/view'; import {AppView} from 'angular2/src/core/compiler/view';
import {isPresent, isBlank} from 'angular2/src/facade/lang'; import {isPresent, isBlank} from 'angular2/src/facade/lang';
import {ListWrapper} from 'angular2/src/facade/collection'; import {ListWrapper} from 'angular2/src/facade/collection';
@ -43,8 +43,8 @@ import {ListWrapper} from 'angular2/src/facade/collection';
} }
}) })
export class For { export class For {
viewContainer: ViewContainer; viewContainer: ViewContainerRef;
constructor(viewContainer:ViewContainer) { constructor(viewContainer:ViewContainerRef) {
this.viewContainer = viewContainer; this.viewContainer = viewContainer;
} }

6
modules/angular2/src/directives/if.js vendored
View File

@ -1,5 +1,5 @@
import {Viewport} from 'angular2/src/core/annotations/annotations'; import {Viewport} from 'angular2/src/core/annotations/annotations';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {isBlank} from 'angular2/src/facade/lang'; import {isBlank} from 'angular2/src/facade/lang';
/** /**
@ -32,10 +32,10 @@ import {isBlank} from 'angular2/src/facade/lang';
} }
}) })
export class If { export class If {
viewContainer: ViewContainer; viewContainer: ViewContainerRef;
prevCondition: boolean; prevCondition: boolean;
constructor(viewContainer: ViewContainer) { constructor(viewContainer: ViewContainerRef) {
this.viewContainer = viewContainer; this.viewContainer = viewContainer;
this.prevCondition = null; this.prevCondition = null;
} }

18
modules/angular2/src/directives/switch.js vendored
View File

@ -1,5 +1,5 @@
import {Decorator, Viewport} from 'angular2/src/core/annotations/annotations'; import {Decorator, Viewport} from 'angular2/src/core/annotations/annotations';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {isPresent, isBlank, normalizeBlank} from 'angular2/src/facade/lang'; import {isPresent, isBlank, normalizeBlank} from 'angular2/src/facade/lang';
import {ListWrapper, List, MapWrapper, Map} from 'angular2/src/facade/collection'; import {ListWrapper, List, MapWrapper, Map} from 'angular2/src/facade/collection';
import {Parent} from 'angular2/src/core/annotations/visibility'; import {Parent} from 'angular2/src/core/annotations/visibility';
@ -41,7 +41,7 @@ export class Switch {
_switchValue: any; _switchValue: any;
_useDefault: boolean; _useDefault: boolean;
_valueViewContainers: Map; _valueViewContainers: Map;
_activeViewContainers: List<ViewContainer>; _activeViewContainers: List<ViewContainerRef>;
constructor() { constructor() {
this._valueViewContainers = MapWrapper.create(); this._valueViewContainers = MapWrapper.create();
@ -65,7 +65,7 @@ export class Switch {
this._switchValue = value; this._switchValue = value;
} }
_onWhenValueChanged(oldWhen, newWhen, viewContainer: ViewContainer):void { _onWhenValueChanged(oldWhen, newWhen, viewContainer: ViewContainerRef):void {
this._deregisterViewContainer(oldWhen, viewContainer); this._deregisterViewContainer(oldWhen, viewContainer);
this._registerViewContainer(newWhen, viewContainer); this._registerViewContainer(newWhen, viewContainer);
@ -96,7 +96,7 @@ export class Switch {
this._activeViewContainers = ListWrapper.create(); this._activeViewContainers = ListWrapper.create();
} }
_activateViewContainers(containers: List<ViewContainer>):void { _activateViewContainers(containers: List<ViewContainerRef>):void {
// TODO(vicb): assert(this._activeViewContainers.length === 0); // TODO(vicb): assert(this._activeViewContainers.length === 0);
if (isPresent(containers)) { if (isPresent(containers)) {
for (var i = 0; i < containers.length; i++) { for (var i = 0; i < containers.length; i++) {
@ -106,7 +106,7 @@ export class Switch {
} }
} }
_registerViewContainer(value, container: ViewContainer): void { _registerViewContainer(value, container: ViewContainerRef): void {
var containers = MapWrapper.get(this._valueViewContainers, value); var containers = MapWrapper.get(this._valueViewContainers, value);
if (isBlank(containers)) { if (isBlank(containers)) {
containers = ListWrapper.create(); containers = ListWrapper.create();
@ -115,7 +115,7 @@ export class Switch {
ListWrapper.push(containers, container); ListWrapper.push(containers, container);
} }
_deregisterViewContainer(value, container: ViewContainer):void { _deregisterViewContainer(value, container: ViewContainerRef):void {
// `_whenDefault` is used a marker for non-registered whens // `_whenDefault` is used a marker for non-registered whens
if (value == _whenDefault) return; if (value == _whenDefault) return;
var containers = MapWrapper.get(this._valueViewContainers, value); var containers = MapWrapper.get(this._valueViewContainers, value);
@ -153,9 +153,9 @@ export class Switch {
export class SwitchWhen { export class SwitchWhen {
_value: any; _value: any;
_switch: Switch; _switch: Switch;
_viewContainer: ViewContainer; _viewContainer: ViewContainerRef;
constructor(viewContainer: ViewContainer, @Parent() sswitch: Switch) { constructor(viewContainer: ViewContainerRef, @Parent() sswitch: Switch) {
// `_whenDefault` is used as a marker for a not yet initialized value // `_whenDefault` is used as a marker for a not yet initialized value
this._value = _whenDefault; this._value = _whenDefault;
this._switch = sswitch; this._switch = sswitch;
@ -186,7 +186,7 @@ export class SwitchWhen {
selector: '[switch-default]' selector: '[switch-default]'
}) })
export class SwitchDefault { export class SwitchDefault {
constructor(viewContainer: ViewContainer, @Parent() sswitch: Switch) { constructor(viewContainer: ViewContainerRef, @Parent() sswitch: Switch) {
sswitch._registerViewContainer(_whenDefault, viewContainer); sswitch._registerViewContainer(_whenDefault, viewContainer);
} }
} }

12
modules/angular2/src/render/api.js vendored
View File

@ -138,7 +138,7 @@ export class ProtoViewRef {}
// An opaque reference to a RenderView // An opaque reference to a RenderView
export class ViewRef {} export class ViewRef {}
export class ViewContainerRef { export class RenderViewContainerRef {
view:ViewRef; view:ViewRef;
elementIndex:number; elementIndex:number;
constructor(view:ViewRef, elementIndex: number) { constructor(view:ViewRef, elementIndex: number) {
@ -193,27 +193,27 @@ export class Renderer {
/** /**
* Creates a view and inserts it into a ViewContainer. * Creates a view and inserts it into a ViewContainer.
* @param {ViewContainerRef} viewContainerRef * @param {RenderViewContainerRef} viewContainerRef
* @param {ProtoViewRef} protoViewRef A ProtoViewRef of type ProtoViewDto.HOST_VIEW_TYPE or ProtoViewDto.EMBEDDED_VIEW_TYPE * @param {ProtoViewRef} protoViewRef A ProtoViewRef of type ProtoViewDto.HOST_VIEW_TYPE or ProtoViewDto.EMBEDDED_VIEW_TYPE
* @param {number} atIndex * @param {number} atIndex
* @return {List<ViewRef>} the view and all of its nested child component views * @return {List<ViewRef>} the view and all of its nested child component views
*/ */
createViewInContainer(vcRef:ViewContainerRef, atIndex:number, protoViewRef:ProtoViewRef):List<ViewRef> { return null; } createViewInContainer(vcRef:RenderViewContainerRef, atIndex:number, protoViewRef:ProtoViewRef):List<ViewRef> { return null; }
/** /**
* Destroys the view in the given ViewContainer * Destroys the view in the given ViewContainer
*/ */
destroyViewInContainer(vcRef:ViewContainerRef, atIndex:number):void {} destroyViewInContainer(vcRef:RenderViewContainerRef, atIndex:number):void {}
/** /**
* Inserts a detached view into a viewContainer. * Inserts a detached view into a viewContainer.
*/ */
insertViewIntoContainer(vcRef:ViewContainerRef, atIndex:number, view:ViewRef):void {} insertViewIntoContainer(vcRef:RenderViewContainerRef, atIndex:number, view:ViewRef):void {}
/** /**
* Detaches a view from a container so that it can be inserted later on * Detaches a view from a container so that it can be inserted later on
*/ */
detachViewFromContainer(vcRef:ViewContainerRef, atIndex:number):void {} detachViewFromContainer(vcRef:RenderViewContainerRef, atIndex:number):void {}
/** /**
* Creates a view and * Creates a view and

10
modules/angular2/src/render/dom/direct_dom_renderer.js vendored
View File

@ -14,7 +14,7 @@ import {ProtoViewBuilder} from './view/proto_view_builder';
import {DOM} from 'angular2/src/dom/dom_adapter'; import {DOM} from 'angular2/src/dom/dom_adapter';
import {ViewContainer} from './view/view_container'; import {ViewContainer} from './view/view_container';
function _resolveViewContainer(vc:api.ViewContainerRef) { function _resolveViewContainer(vc:api.RenderViewContainerRef) {
return _resolveView(vc.view).getOrCreateViewContainer(vc.elementIndex); return _resolveView(vc.view).getOrCreateViewContainer(vc.elementIndex);
} }
@ -109,7 +109,7 @@ export class DirectDomRenderer extends api.Renderer {
); );
} }
createViewInContainer(vcRef:api.ViewContainerRef, atIndex:number, protoViewRef:api.ProtoViewRef):List<api.ViewRef> { createViewInContainer(vcRef:api.RenderViewContainerRef, atIndex:number, protoViewRef:api.ProtoViewRef):List<api.ViewRef> {
var view = this._viewFactory.getView(_resolveProtoView(protoViewRef)); var view = this._viewFactory.getView(_resolveProtoView(protoViewRef));
var vc = _resolveViewContainer(vcRef); var vc = _resolveViewContainer(vcRef);
this._viewHydrator.hydrateViewInViewContainer(vc, view); this._viewHydrator.hydrateViewInViewContainer(vc, view);
@ -117,18 +117,18 @@ export class DirectDomRenderer extends api.Renderer {
return _collectComponentChildViewRefs(view); return _collectComponentChildViewRefs(view);
} }
destroyViewInContainer(vcRef:api.ViewContainerRef, atIndex:number):void { destroyViewInContainer(vcRef:api.RenderViewContainerRef, atIndex:number):void {
var vc = _resolveViewContainer(vcRef); var vc = _resolveViewContainer(vcRef);
var view = vc.detach(atIndex); var view = vc.detach(atIndex);
this._viewHydrator.dehydrateViewInViewContainer(vc, view); this._viewHydrator.dehydrateViewInViewContainer(vc, view);
this._viewFactory.returnView(view); this._viewFactory.returnView(view);
} }
insertViewIntoContainer(vcRef:api.ViewContainerRef, atIndex=-1, viewRef:api.ViewRef):void { insertViewIntoContainer(vcRef:api.RenderViewContainerRef, atIndex=-1, viewRef:api.ViewRef):void {
_resolveViewContainer(vcRef).insert(_resolveView(viewRef), atIndex); _resolveViewContainer(vcRef).insert(_resolveView(viewRef), atIndex);
} }
detachViewFromContainer(vcRef:api.ViewContainerRef, atIndex:number):void { detachViewFromContainer(vcRef:api.RenderViewContainerRef, atIndex:number):void {
_resolveViewContainer(vcRef).detach(atIndex); _resolveViewContainer(vcRef).detach(atIndex);
} }

8
modules/angular2/test/core/compiler/element_injector_spec.js vendored
View File

@ -8,7 +8,7 @@ import {Attribute, Query} from 'angular2/src/core/annotations/di';
import {onDestroy} from 'angular2/src/core/annotations/annotations'; import {onDestroy} from 'angular2/src/core/annotations/annotations';
import {Optional, Injector, Inject, bind} from 'angular2/di'; import {Optional, Injector, Inject, bind} from 'angular2/di';
import {AppProtoView, AppView} from 'angular2/src/core/compiler/view'; import {AppProtoView, AppView} from 'angular2/src/core/compiler/view';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {NgElement} from 'angular2/src/core/compiler/ng_element'; import {NgElement} from 'angular2/src/core/compiler/ng_element';
import {Directive} from 'angular2/src/core/annotations/annotations'; import {Directive} from 'angular2/src/core/annotations/annotations';
import {DynamicChangeDetector, ChangeDetectorRef, Parser, Lexer} from 'angular2/change_detection'; import {DynamicChangeDetector, ChangeDetectorRef, Parser, Lexer} from 'angular2/change_detection';
@ -130,7 +130,7 @@ class NeedsElementRef {
class NeedsViewContainer { class NeedsViewContainer {
viewContainer; viewContainer;
constructor(vc:ViewContainer) { constructor(vc:ViewContainerRef) {
this.viewContainer = vc; this.viewContainer = vc;
} }
} }
@ -717,9 +717,9 @@ export function main() {
expect(inj.get(NeedsChangeDetectorRef).changeDetectorRef).toBe(cd.ref); expect(inj.get(NeedsChangeDetectorRef).changeDetectorRef).toBe(cd.ref);
}); });
it('should inject ViewContainer', () => { it('should inject ViewContainerRef', () => {
var inj = injector([NeedsViewContainer]); var inj = injector([NeedsViewContainer]);
expect(inj.get(NeedsViewContainer).viewContainer).toBeAnInstanceOf(ViewContainer); expect(inj.get(NeedsViewContainer).viewContainer).toBeAnInstanceOf(ViewContainerRef);
}); });
}); });

8
modules/angular2/test/core/compiler/integration_spec.js vendored
View File

@ -31,7 +31,7 @@ import {Attribute} from 'angular2/src/core/annotations/di';
import {If} from 'angular2/src/directives/if'; import {If} from 'angular2/src/directives/if';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {Compiler} from 'angular2/src/core/compiler/compiler'; import {Compiler} from 'angular2/src/core/compiler/compiler';
import {ElementRef} from 'angular2/src/core/compiler/element_injector'; import {ElementRef} from 'angular2/src/core/compiler/element_injector';
@ -690,7 +690,7 @@ export function main() {
describe('dynamic ViewContainers', () => { describe('dynamic ViewContainers', () => {
it('should allow to create a ViewContainer at any bound location', it('should allow to create a ViewContainerRef at any bound location',
inject([TestBed, AsyncTestCompleter, Compiler], (tb, async, compiler) => { inject([TestBed, AsyncTestCompleter, Compiler], (tb, async, compiler) => {
tb.overrideView(MyComp, new View({ tb.overrideView(MyComp, new View({
template: '<div><dynamic-vp #dynamic></dynamic-vp></div>', template: '<div><dynamic-vp #dynamic></dynamic-vp></div>',
@ -862,7 +862,7 @@ class SimpleImperativeViewComponent {
}) })
class DynamicViewport { class DynamicViewport {
done; done;
constructor(vc:ViewContainer, inj:Injector, compiler:Compiler) { constructor(vc:ViewContainerRef, inj:Injector, compiler:Compiler) {
var myService = new MyService(); var myService = new MyService();
myService.greeting = 'dynamic greet'; myService.greeting = 'dynamic greet';
this.done = compiler.compileInHost(ChildCompUsingService).then( (hostPv) => { this.done = compiler.compileInHost(ChildCompUsingService).then( (hostPv) => {
@ -1040,7 +1040,7 @@ class ChildComp2 {
selector: '[some-viewport]' selector: '[some-viewport]'
}) })
class SomeViewport { class SomeViewport {
constructor(container: ViewContainer) { constructor(container: ViewContainerRef) {
container.create().setLocal('some-tmpl', 'hello'); container.create().setLocal('some-tmpl', 'hello');
container.create().setLocal('some-tmpl', 'again'); container.create().setLocal('some-tmpl', 'again');
} }

14
modules/angular2/test/core/compiler/view_container_spec.js → modules/angular2/test/core/compiler/view_container_ref_spec.js vendored
View File

@ -19,14 +19,14 @@ import {MapWrapper} from 'angular2/src/facade/collection';
import {IMPLEMENTS, isBlank, isPresent} from 'angular2/src/facade/lang'; import {IMPLEMENTS, isBlank, isPresent} from 'angular2/src/facade/lang';
import {ElementRef} from 'angular2/src/core/compiler/element_injector'; import {ElementRef} from 'angular2/src/core/compiler/element_injector';
import {AppView, AppProtoView, InternalAppViewContainer} from 'angular2/src/core/compiler/view'; import {AppView, AppProtoView, AppViewContainer} from 'angular2/src/core/compiler/view';
import {ViewContainer} from 'angular2/src/core/compiler/view_container'; import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {AppViewManager} from 'angular2/src/core/compiler/view_manager'; import {AppViewManager} from 'angular2/src/core/compiler/view_manager';
export function main() { export function main() {
// TODO(tbosch): add missing tests // TODO(tbosch): add missing tests
describe('ViewContainer', () => { describe('ViewContainerRef', () => {
var location; var location;
var view; var view;
var viewManager; var viewManager;
@ -40,7 +40,7 @@ export function main() {
} }
function createViewContainer(defaultProtoView = null) { function createViewContainer(defaultProtoView = null) {
return new ViewContainer(viewManager, location, defaultProtoView); return new ViewContainerRef(viewManager, location, defaultProtoView);
} }
beforeEach( () => { beforeEach( () => {
@ -50,14 +50,14 @@ export function main() {
location = new ElementRef(null, view, 0, null, null, null); location = new ElementRef(null, view, 0, null, null, null);
}); });
it('should return a 0 length if there is no underlying ViewContainer', () => { it('should return a 0 length if there is no underlying ViewContainerRef', () => {
var vc = createViewContainer(); var vc = createViewContainer();
expect(vc.length).toBe(0); expect(vc.length).toBe(0);
}); });
it('should return the size of the underlying ViewContainer', () => { it('should return the size of the underlying ViewContainerRef', () => {
var vc = createViewContainer(); var vc = createViewContainer();
view.viewContainers = [new InternalAppViewContainer()]; view.viewContainers = [new AppViewContainer()];
view.viewContainers[0].views = [createView()]; view.viewContainers[0].views = [createView()];
expect(vc.length).toBe(1); expect(vc.length).toBe(1);
}); });

12
modules/angular2/test/core/compiler/view_manager_spec.js vendored
View File

@ -18,8 +18,8 @@ import {Injector, bind} from 'angular2/di';
import {IMPLEMENTS, isBlank, isPresent} from 'angular2/src/facade/lang'; import {IMPLEMENTS, isBlank, isPresent} from 'angular2/src/facade/lang';
import {MapWrapper, ListWrapper, StringMapWrapper} from 'angular2/src/facade/collection'; import {MapWrapper, ListWrapper, StringMapWrapper} from 'angular2/src/facade/collection';
import {AppProtoView, AppView, InternalAppViewContainer} from 'angular2/src/core/compiler/view'; import {AppProtoView, AppView, AppViewContainer} from 'angular2/src/core/compiler/view';
import {Renderer, ViewRef, ProtoViewRef, ViewContainerRef} from 'angular2/src/render/api'; import {Renderer, ViewRef, ProtoViewRef, RenderViewContainerRef} from 'angular2/src/render/api';
import {ElementBinder} from 'angular2/src/core/compiler/element_binder'; import {ElementBinder} from 'angular2/src/core/compiler/element_binder';
import {DirectiveBinding, ElementInjector, ElementRef} from 'angular2/src/core/compiler/element_injector'; import {DirectiveBinding, ElementInjector, ElementRef} from 'angular2/src/core/compiler/element_injector';
import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader'; import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
@ -122,7 +122,7 @@ export function main() {
utils.spy('attachViewInContainer').andCallFake( (parentView, elementIndex, atIndex, childView) => { utils.spy('attachViewInContainer').andCallFake( (parentView, elementIndex, atIndex, childView) => {
var viewContainer = parentView.viewContainers[elementIndex]; var viewContainer = parentView.viewContainers[elementIndex];
if (isBlank(viewContainer)) { if (isBlank(viewContainer)) {
viewContainer = new InternalAppViewContainer(); viewContainer = new AppViewContainer();
parentView.viewContainers[elementIndex] = viewContainer; parentView.viewContainers[elementIndex] = viewContainer;
} }
ListWrapper.insert(viewContainer.views, atIndex, childView); ListWrapper.insert(viewContainer.views, atIndex, childView);
@ -385,7 +385,7 @@ export function main() {
childProtoView = createProtoView(); childProtoView = createProtoView();
}); });
it('should create a ViewContainer if not yet existing', () => { it('should create a ViewContainerRef if not yet existing', () => {
manager.createViewInContainer(elementRef(parentView, 0), 0, childProtoView, null); manager.createViewInContainer(elementRef(parentView, 0), 0, childProtoView, null);
expect(parentView.viewContainers[0]).toBeTruthy(); expect(parentView.viewContainers[0]).toBeTruthy();
}); });
@ -411,7 +411,7 @@ export function main() {
it('should create and set the render view', () => { it('should create and set the render view', () => {
manager.createViewInContainer(elementRef(parentView, 0), 0, childProtoView, null); manager.createViewInContainer(elementRef(parentView, 0), 0, childProtoView, null);
expect(renderer.spy('createViewInContainer')).toHaveBeenCalledWith( expect(renderer.spy('createViewInContainer')).toHaveBeenCalledWith(
new ViewContainerRef(parentView.render, 0), 0, childProtoView.render); new RenderViewContainerRef(parentView.render, 0), 0, childProtoView.render);
expect(createdViews[0].render).toBe(createdRenderViews[0]); expect(createdViews[0].render).toBe(createdRenderViews[0]);
}); });
@ -451,7 +451,7 @@ export function main() {
it('should destroy and clear the render view', () => { it('should destroy and clear the render view', () => {
manager.destroyViewInContainer(elementRef(parentView, 0), 0); manager.destroyViewInContainer(elementRef(parentView, 0), 0);
expect(renderer.spy('destroyViewInContainer')).toHaveBeenCalledWith(new ViewContainerRef(parentView.render, 0), 0); expect(renderer.spy('destroyViewInContainer')).toHaveBeenCalledWith(new RenderViewContainerRef(parentView.render, 0), 0);
expect(childView.render).toBe(null); expect(childView.render).toBe(null);
}); });

6
modules/angular2/test/render/dom/direct_dom_renderer_integration_spec.js vendored
View File

@ -15,7 +15,7 @@ import {
import {DOM} from 'angular2/src/dom/dom_adapter'; import {DOM} from 'angular2/src/dom/dom_adapter';
import {ProtoViewDto, ViewDefinition, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api'; import {ProtoViewDto, ViewDefinition, RenderViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
import {IntegrationTestbed, LoggingEventDispatcher, FakeEvent} from './integration_testbed'; import {IntegrationTestbed, LoggingEventDispatcher, FakeEvent} from './integration_testbed';
@ -138,7 +138,7 @@ export function main() {
var viewRef = renderer.createInPlaceHostView(null, rootEl, rootProtoView.render)[1]; var viewRef = renderer.createInPlaceHostView(null, rootEl, rootProtoView.render)[1];
var vcProtoViewRef = rootProtoView.elementBinders[0] var vcProtoViewRef = rootProtoView.elementBinders[0]
.nestedProtoView.elementBinders[0].nestedProtoView.render; .nestedProtoView.elementBinders[0].nestedProtoView.render;
var vcRef = new ViewContainerRef(viewRef, 0); var vcRef = new RenderViewContainerRef(viewRef, 0);
expect(rootEl).toHaveText(''); expect(rootEl).toHaveText('');
var childViewRef = renderer.createViewInContainer(vcRef, 0, vcProtoViewRef)[0]; var childViewRef = renderer.createViewInContainer(vcRef, 0, vcProtoViewRef)[0];
expect(rootEl).toHaveText('hello'); expect(rootEl).toHaveText('hello');
@ -166,7 +166,7 @@ export function main() {
var viewRef = renderer.createInPlaceHostView(null, rootEl, rootProtoView.render)[1]; var viewRef = renderer.createInPlaceHostView(null, rootEl, rootProtoView.render)[1];
var vcProtoViewRef = rootProtoView.elementBinders[0] var vcProtoViewRef = rootProtoView.elementBinders[0]
.nestedProtoView.elementBinders[0].nestedProtoView.render; .nestedProtoView.elementBinders[0].nestedProtoView.render;
var vcRef = new ViewContainerRef(viewRef, 0); var vcRef = new RenderViewContainerRef(viewRef, 0);
var viewRef1 = renderer.createViewInContainer(vcRef, 0, vcProtoViewRef)[0]; var viewRef1 = renderer.createViewInContainer(vcRef, 0, vcProtoViewRef)[0];
renderer.destroyViewInContainer(vcRef, 0); renderer.destroyViewInContainer(vcRef, 0);

2
modules/angular2/test/render/dom/integration_testbed.js vendored
View File

@ -6,7 +6,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
import {Parser, Lexer} from 'angular2/change_detection'; import {Parser, Lexer} from 'angular2/change_detection';
import {DirectDomRenderer} from 'angular2/src/render/dom/direct_dom_renderer'; import {DirectDomRenderer} from 'angular2/src/render/dom/direct_dom_renderer';
import {Compiler} from 'angular2/src/render/dom/compiler/compiler'; import {Compiler} from 'angular2/src/render/dom/compiler/compiler';
import {ProtoViewRef, ProtoViewDto, ViewDefinition, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api'; import {ProtoViewRef, ProtoViewDto, ViewDefinition, RenderViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
import {DefaultStepFactory} from 'angular2/src/render/dom/compiler/compile_step_factory'; import {DefaultStepFactory} from 'angular2/src/render/dom/compiler/compile_step_factory';
import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader'; import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader';
import {UrlResolver} from 'angular2/src/services/url_resolver'; import {UrlResolver} from 'angular2/src/services/url_resolver';

16
modules/angular2/test/render/dom/shadow_dom_emulation_integration_spec.js vendored
View File

@ -17,7 +17,7 @@ import {MapWrapper, ListWrapper, StringMapWrapper} from 'angular2/src/facade/col
import {DOM} from 'angular2/src/dom/dom_adapter'; import {DOM} from 'angular2/src/dom/dom_adapter';
import { import {
ProtoViewDto, ViewDefinition, ViewContainerRef, DirectiveMetadata ProtoViewDto, ViewDefinition, RenderViewContainerRef, DirectiveMetadata
} from 'angular2/src/render/api'; } from 'angular2/src/render/api';
import {EmulatedScopedShadowDomStrategy} from 'angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy'; import {EmulatedScopedShadowDomStrategy} from 'angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy';
@ -183,7 +183,7 @@ export function main() {
}); });
compileRoot('main').then( (pv) => { compileRoot('main').then( (pv) => {
var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render); var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render);
var vcRef = new ViewContainerRef(viewRefs[1], 1); var vcRef = new RenderViewContainerRef(viewRefs[1], 1);
var vcProtoViewRef = pv.elementBinders[0].nestedProtoView var vcProtoViewRef = pv.elementBinders[0].nestedProtoView
.elementBinders[1].nestedProtoView.render; .elementBinders[1].nestedProtoView.render;
expect(rootEl).toHaveText('(, B)'); expect(rootEl).toHaveText('(, B)');
@ -213,7 +213,7 @@ export function main() {
}); });
compileRoot('main').then( (pv) => { compileRoot('main').then( (pv) => {
var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render); var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render);
var vcRef = new ViewContainerRef(viewRefs[1], 1); var vcRef = new RenderViewContainerRef(viewRefs[1], 1);
var vcProtoViewRef = pv.elementBinders[0].nestedProtoView var vcProtoViewRef = pv.elementBinders[0].nestedProtoView
.elementBinders[1].nestedProtoView.render; .elementBinders[1].nestedProtoView.render;
expect(rootEl).toHaveText('(, B)'); expect(rootEl).toHaveText('(, B)');
@ -264,7 +264,7 @@ export function main() {
}); });
compileRoot('main').then( (pv) => { compileRoot('main').then( (pv) => {
var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render); var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render);
var vcRef = new ViewContainerRef(viewRefs[1], 1); var vcRef = new RenderViewContainerRef(viewRefs[1], 1);
var vcProtoViewRef = pv.elementBinders[0].nestedProtoView var vcProtoViewRef = pv.elementBinders[0].nestedProtoView
.elementBinders[1].nestedProtoView.render; .elementBinders[1].nestedProtoView.render;
expect(rootEl).toHaveText('OUTER(INNER(INNERINNER(,BC)))'); expect(rootEl).toHaveText('OUTER(INNER(INNERINNER(,BC)))');
@ -290,7 +290,7 @@ export function main() {
}); });
compileRoot('main').then( (pv) => { compileRoot('main').then( (pv) => {
var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render); var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render);
var vcRef = new ViewContainerRef(viewRefs[2], 0); var vcRef = new RenderViewContainerRef(viewRefs[2], 0);
var vcProtoViewRef = pv.elementBinders[0].nestedProtoView var vcProtoViewRef = pv.elementBinders[0].nestedProtoView
.elementBinders[0].nestedProtoView .elementBinders[0].nestedProtoView
.elementBinders[0].nestedProtoView.render; .elementBinders[0].nestedProtoView.render;
@ -323,9 +323,9 @@ export function main() {
}); });
compileRoot('main').then( (pv) => { compileRoot('main').then( (pv) => {
var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render); var viewRefs = renderer.createInPlaceHostView(null, rootEl, pv.render);
var vcRef0 = new ViewContainerRef(viewRefs[2], 0); var vcRef0 = new RenderViewContainerRef(viewRefs[2], 0);
var vcRef1 = new ViewContainerRef(viewRefs[3], 0); var vcRef1 = new RenderViewContainerRef(viewRefs[3], 0);
var vcRef2 = new ViewContainerRef(viewRefs[4], 0); var vcRef2 = new RenderViewContainerRef(viewRefs[4], 0);
var mainPv = pv.elementBinders[0].nestedProtoView; var mainPv = pv.elementBinders[0].nestedProtoView;
var pvRef = mainPv.elementBinders[0].nestedProtoView.elementBinders[0].nestedProtoView.render; var pvRef = mainPv.elementBinders[0].nestedProtoView.elementBinders[0].nestedProtoView.render;

2
modules/benchmarks/src/tree/tree_benchmark.js
View File

@ -1,4 +1,4 @@
import {bootstrap, Component, Viewport, View, ViewContainer, Compiler, NgElement, Decorator} from 'angular2/angular2'; import {bootstrap, Component, Viewport, View, ViewContainerRef, Compiler, NgElement, Decorator} from 'angular2/angular2';
import {LifeCycle} from 'angular2/src/core/life_cycle/life_cycle'; import {LifeCycle} from 'angular2/src/core/life_cycle/life_cycle';
import {reflector} from 'angular2/src/reflection/reflection'; import {reflector} from 'angular2/src/reflection/reflection';