chore(rename): rename View and Template concepts for #1244
This commit is contained in:
parent
564477b8a0
commit
bf7933714a
|
@ -1,6 +1,6 @@
|
|||
export * from './src/core/annotations/visibility';
|
||||
export * from './src/core/compiler/interfaces';
|
||||
export * from './src/core/annotations/template';
|
||||
export * from './src/core/annotations/view';
|
||||
export * from './src/core/application';
|
||||
export * from './src/core/application_tokens';
|
||||
export * from './src/core/annotations/di';
|
||||
|
|
|
@ -67,10 +67,10 @@ Here is a trivial example of a tooltip decorator. The directive will log a toolt
|
|||
```
|
||||
@Decorator({
|
||||
selector: '[tooltip]', // CSS Selector which triggers the decorator
|
||||
bind: { // List which properties need to be bound
|
||||
properties: { // List which properties need to be bound
|
||||
text: 'tooltip' // - DOM element tooltip property should be
|
||||
}, // mapped to the directive text property.
|
||||
events: { // List which events need to be mapped.
|
||||
hostListeners: { // List which events need to be mapped.
|
||||
mouseover: 'show' // - Invoke the show() method every time
|
||||
} // the mouseover event is fired.
|
||||
})
|
||||
|
@ -112,13 +112,13 @@ Example of a component:
|
|||
```
|
||||
@Component({ | Component annotation
|
||||
selector: 'pane', | CSS selector on <pane> element
|
||||
bind: { | List which property need to be bound
|
||||
properties: { | List which property need to be bound
|
||||
'title': 'title', | - title mapped to component title
|
||||
'open': 'open' | - open attribute mapped to component's open property
|
||||
}, |
|
||||
}) |
|
||||
@Template({ | Template annotation
|
||||
url: 'pane.html' | - URL of template HTML
|
||||
@View({ | View annotation
|
||||
templateUrl: 'pane.html' | - URL of template HTML
|
||||
}) |
|
||||
class Pane { | Component controller class
|
||||
title:string; | - title property
|
||||
|
@ -179,7 +179,7 @@ Viewport is a directive which can control instantiation of child views which are
|
|||
```
|
||||
@Viewport({
|
||||
selector: '[if]',
|
||||
bind: {
|
||||
properties: {
|
||||
'condition': 'if'
|
||||
}
|
||||
})
|
||||
|
@ -220,7 +220,7 @@ To better understand the kinds of injections which are supported in Angular we h
|
|||
|
||||
### Injecting Services
|
||||
|
||||
Service injection is the most straight forward kind of injection which Angular supports. It involves a component configuring the `services` 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.
|
||||
|
||||
|
@ -231,10 +231,10 @@ class MyService {} | Assume a service which needs to be inject
|
|||
|
|
||||
@Component({ | Assume a top level application component which
|
||||
selector: 'my-app', | configures the services to be injected.
|
||||
services: [MyService] |
|
||||
injectables: [MyService] |
|
||||
}) |
|
||||
@Template({ | Assume we have a template that needs to be
|
||||
url: 'my_app.html', | configured with directives to be injected.
|
||||
@View({ | Assume we have a template that needs to be
|
||||
templateUrl: 'my_app.html', | configured with directives to be injected.
|
||||
directives: [House] |
|
||||
}) |
|
||||
class MyApp {} |
|
||||
|
@ -279,7 +279,7 @@ Here is an example of the kinds of injections which can be achieved:
|
|||
@Component({ |
|
||||
selector: 'my-app', |
|
||||
template: new TemplateConfig({ |
|
||||
url: 'my_app.html', |
|
||||
templateUrl: 'my_app.html', |
|
||||
directives: [Form, FieldSet, |
|
||||
Field, Primary] |
|
||||
}) |
|
||||
|
|
|
@ -12,12 +12,12 @@ Views form a tree structure which mimics the DOM tree.
|
|||
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
|
||||
not undergo structural changes (only property changes).
|
||||
* Views represent a running instance of a DOM Template. 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
|
||||
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
|
||||
the insertion of child Views.
|
||||
* Views are created from a ProtoView. A ProtoView is a compiled DOM Template which is efficient at
|
||||
* Views are created from a ProtoView. A ProtoView is a compiled DOM View which is efficient at
|
||||
creating Views.
|
||||
* View contains a context object. The context represents the object instance against which all
|
||||
expressions are evaluated.
|
||||
|
@ -40,7 +40,7 @@ class Greeter {
|
|||
}
|
||||
```
|
||||
|
||||
And assume following HTML Template:
|
||||
And assume following HTML View:
|
||||
|
||||
```
|
||||
<div>
|
||||
|
@ -90,7 +90,7 @@ Note:
|
|||
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.
|
||||
|
||||
Let's start with a Template such as:
|
||||
Let's start with a View such as:
|
||||
|
||||
```
|
||||
<ul>
|
||||
|
@ -194,7 +194,7 @@ class Greeter {
|
|||
}
|
||||
```
|
||||
|
||||
And assume the following HTML Template:
|
||||
And assume the following HTML View:
|
||||
|
||||
```
|
||||
<div> | viewA(greeter)
|
||||
|
|
|
@ -86,7 +86,7 @@ import {Injectable} from 'angular2/di';
|
|||
*
|
||||
* @Decorator({
|
||||
* selector: '[dependency]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'id':'dependency'
|
||||
* }
|
||||
* })
|
||||
|
@ -272,7 +272,8 @@ export class Directive extends Injectable {
|
|||
/**
|
||||
* Enumerates the set of properties that accept data binding for a directive.
|
||||
*
|
||||
* The `bind` property defines a set of `directiveProperty` to `bindingProperty` key-value pairs:
|
||||
* The `properties` property defines a set of `directiveProperty` to `bindingProperty`
|
||||
* key-value pairs:
|
||||
*
|
||||
* - `directiveProperty` specifies the component property where the value is written.
|
||||
* - `bindingProperty` specifies the DOM property where the value is read from.
|
||||
|
@ -285,7 +286,7 @@ export class Directive extends Injectable {
|
|||
*
|
||||
* ```
|
||||
* @Directive({
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'directiveProperty1': 'bindingProperty1',
|
||||
* 'directiveProperty2': 'bindingProperty2 | pipe1 | ...',
|
||||
* ...
|
||||
|
@ -302,7 +303,7 @@ export class Directive extends Injectable {
|
|||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[tooltip]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'text': 'tooltip'
|
||||
* }
|
||||
* })
|
||||
|
@ -321,8 +322,8 @@ export class Directive extends Injectable {
|
|||
* <div tooltip="Some Text">...</div>
|
||||
* ```
|
||||
*
|
||||
* Whenever the `someExpression` expression changes, the `bind` declaration instructs Angular to update the
|
||||
* `Tooltip`'s `text` property.
|
||||
* Whenever the `someExpression` expression changes, the `properties` declaration instructs
|
||||
* Angular to update the `Tooltip`'s `text` property.
|
||||
*
|
||||
*
|
||||
*
|
||||
|
@ -336,7 +337,7 @@ export class Directive extends Injectable {
|
|||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[class-set]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'classChanges': 'classSet | keyValDiff'
|
||||
* }
|
||||
* })
|
||||
|
@ -356,12 +357,12 @@ export class Directive extends Injectable {
|
|||
* In this case, the two pipes compose as if they were inlined: `someExpression | somePipe | keyValDiff`.
|
||||
*
|
||||
*/
|
||||
bind:any; // StringMap
|
||||
properties:any; // StringMap
|
||||
|
||||
/**
|
||||
* Specifies which DOM events a directive listens to.
|
||||
* Specifies which DOM hostListeners a directive listens to.
|
||||
*
|
||||
* The `events` property defines a set of `event` to `method` key-value pairs:
|
||||
* The `hostListeners` property defines 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.
|
||||
|
@ -377,7 +378,7 @@ export class Directive extends Injectable {
|
|||
*
|
||||
* ```
|
||||
* @Directive({
|
||||
* events: {
|
||||
* hostListeners: {
|
||||
* 'event1': 'onMethod1(arguments)',
|
||||
* ...
|
||||
* }
|
||||
|
@ -386,13 +387,13 @@ export class Directive extends Injectable {
|
|||
*
|
||||
* ## Basic Event Binding:
|
||||
*
|
||||
* Suppose you want to write a directive that triggers on `change` events in the DOM. You would define the event
|
||||
* Suppose you want to write a directive that triggers on `change` hostListeners in the DOM. You would define the event
|
||||
* binding as follows:
|
||||
*
|
||||
* ```
|
||||
* @Decorator({
|
||||
* selector: 'input',
|
||||
* events: {
|
||||
* hostListeners: {
|
||||
* 'change': 'onChange($event)'
|
||||
* }
|
||||
* })
|
||||
|
@ -405,10 +406,10 @@ export class Directive extends Injectable {
|
|||
* Here the `onChange` method of `InputDecorator` is invoked whenever the DOM element fires the 'change' event.
|
||||
*
|
||||
*/
|
||||
events:any; // StringMap
|
||||
hostListeners:any; // StringMap
|
||||
|
||||
/**
|
||||
* Specifies a set of lifecycle events in which the directive participates.
|
||||
* Specifies a set of lifecycle hostListeners in which the directive participates.
|
||||
*
|
||||
* See: [onChange], [onDestroy], [onAllChangesDone] for details.
|
||||
*/
|
||||
|
@ -417,20 +418,20 @@ export class Directive extends Injectable {
|
|||
@CONST()
|
||||
constructor({
|
||||
selector,
|
||||
bind,
|
||||
events,
|
||||
properties,
|
||||
hostListeners,
|
||||
lifecycle
|
||||
}:{
|
||||
selector:string,
|
||||
bind:any,
|
||||
events: any,
|
||||
properties:any,
|
||||
hostListeners: any,
|
||||
lifecycle:List
|
||||
}={})
|
||||
{
|
||||
super();
|
||||
this.selector = selector;
|
||||
this.bind = bind;
|
||||
this.events = events;
|
||||
this.properties = properties;
|
||||
this.hostListeners = hostListeners;
|
||||
this.lifecycle = lifecycle;
|
||||
}
|
||||
|
||||
|
@ -447,17 +448,17 @@ export class Directive extends Injectable {
|
|||
/**
|
||||
* Declare reusable UI building blocks for an application.
|
||||
*
|
||||
* Each Angular component requires a single `@Component` and at least one `@Template` annotation. The `@Component`
|
||||
* annotation specifies when a component is instantiated, and which properties and events it binds to.
|
||||
* 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 [Injector] which is configured with the [Component.services].
|
||||
* - creates a child [Injector] which is configured with the [Component.injectables].
|
||||
*
|
||||
* All template expressions and statements are then evaluated against the component instance.
|
||||
*
|
||||
* For details on the `@Template` annotation, see [Template].
|
||||
* For details on the `@View` annotation, see [View].
|
||||
*
|
||||
* ## Example
|
||||
*
|
||||
|
@ -465,8 +466,8 @@ export class Directive extends Injectable {
|
|||
* @Component({
|
||||
* selector: 'greet'
|
||||
* })
|
||||
* @Template({
|
||||
* inline: 'Hello {{name}}!'
|
||||
* @View({
|
||||
* template: 'Hello {{name}}!'
|
||||
* })
|
||||
* class Greet {
|
||||
* name: string;
|
||||
|
@ -494,16 +495,16 @@ export class Component extends Directive {
|
|||
/**
|
||||
* Defines the set of injectable objects that are visible to a Component and its children.
|
||||
*
|
||||
* The [services] defined in the Component annotation allow you to configure a set of bindings for the component's
|
||||
* The [injectables] 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 [services] annotation. The injectable objects then become available for injection to the component
|
||||
* the Component [injectables] 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 [services] injectable is identical to [Injector] injectable configuration. See
|
||||
* The syntax for configuring the [injectables] injectable is identical to [Injector] injectable configuration. See
|
||||
* [Injector] for additional detail.
|
||||
*
|
||||
*
|
||||
|
@ -520,12 +521,12 @@ export class Component extends Directive {
|
|||
*
|
||||
* @Component({
|
||||
* selector: 'greet',
|
||||
* services: [
|
||||
* injectables: [
|
||||
* Greeter
|
||||
* ]
|
||||
* })
|
||||
* @Template({
|
||||
* inline: `{{greeter.greet('world')}}!`,
|
||||
* @View({
|
||||
* template: `{{greeter.greet('world')}}!`,
|
||||
* directives: Child
|
||||
* })
|
||||
* class HelloWorld {
|
||||
|
@ -537,34 +538,34 @@ export class Component extends Directive {
|
|||
* }
|
||||
* ```
|
||||
*/
|
||||
services:List;
|
||||
injectables:List;
|
||||
|
||||
@CONST()
|
||||
constructor({
|
||||
selector,
|
||||
bind,
|
||||
events,
|
||||
services,
|
||||
properties,
|
||||
hostListeners,
|
||||
injectables,
|
||||
lifecycle,
|
||||
changeDetection
|
||||
}:{
|
||||
selector:string,
|
||||
bind:Object,
|
||||
events:Object,
|
||||
services:List,
|
||||
properties:Object,
|
||||
hostListeners:Object,
|
||||
injectables:List,
|
||||
lifecycle:List,
|
||||
changeDetection:string
|
||||
}={})
|
||||
{
|
||||
super({
|
||||
selector: selector,
|
||||
bind: bind,
|
||||
events: events,
|
||||
properties: properties,
|
||||
hostListeners: hostListeners,
|
||||
lifecycle: lifecycle
|
||||
});
|
||||
|
||||
this.changeDetection = changeDetection;
|
||||
this.services = services;
|
||||
this.injectables = injectables;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -600,8 +601,8 @@ export class Component extends Directive {
|
|||
* @Component({
|
||||
* selector: 'hello-cmp'
|
||||
* })
|
||||
* @Template({
|
||||
* inline: "{{greeting}}"
|
||||
* @View({
|
||||
* template: "{{greeting}}"
|
||||
* })
|
||||
* class HelloCmp {
|
||||
* greeting:string;
|
||||
|
@ -617,33 +618,33 @@ export class Component extends Directive {
|
|||
*/
|
||||
export class DynamicComponent extends Directive {
|
||||
/**
|
||||
* Same as [Component.services].
|
||||
* Same as [Component.injectables].
|
||||
*/
|
||||
// TODO(vsankin): Please extract into AbstractComponent
|
||||
services:any; //List;
|
||||
injectables:any; //List;
|
||||
|
||||
@CONST()
|
||||
constructor({
|
||||
selector,
|
||||
bind,
|
||||
events,
|
||||
services,
|
||||
properties,
|
||||
hostListeners,
|
||||
injectables,
|
||||
lifecycle
|
||||
}:{
|
||||
selector:string,
|
||||
bind:Object,
|
||||
events:Object,
|
||||
services:List,
|
||||
properties:Object,
|
||||
hostListeners:Object,
|
||||
injectables:List,
|
||||
lifecycle:List
|
||||
}={}) {
|
||||
super({
|
||||
selector: selector,
|
||||
bind: bind,
|
||||
events: events,
|
||||
properties: properties,
|
||||
hostListeners: hostListeners,
|
||||
lifecycle: lifecycle
|
||||
});
|
||||
|
||||
this.services = services;
|
||||
this.injectables = injectables;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -670,10 +671,10 @@ export class DynamicComponent extends Directive {
|
|||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[tooltip]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'text': 'tooltip'
|
||||
* },
|
||||
* events: {
|
||||
* hostListeners: {
|
||||
* 'onmouseenter': 'onMouseEnter()',
|
||||
* 'onmouseleave': 'onMouseLeave()'
|
||||
* }
|
||||
|
@ -718,22 +719,22 @@ export class Decorator extends Directive {
|
|||
@CONST()
|
||||
constructor({
|
||||
selector,
|
||||
bind,
|
||||
events,
|
||||
properties,
|
||||
hostListeners,
|
||||
lifecycle,
|
||||
compileChildren = true,
|
||||
}:{
|
||||
selector:string,
|
||||
bind:any,
|
||||
events:any,
|
||||
properties:any,
|
||||
hostListeners:any,
|
||||
lifecycle:List,
|
||||
compileChildren:boolean
|
||||
}={})
|
||||
{
|
||||
super({
|
||||
selector: selector,
|
||||
bind: bind,
|
||||
events: events,
|
||||
properties: properties,
|
||||
hostListeners: hostListeners,
|
||||
lifecycle: lifecycle
|
||||
});
|
||||
this.compileChildren = compileChildren;
|
||||
|
@ -784,7 +785,7 @@ export class Decorator extends Directive {
|
|||
* ```
|
||||
* @Viewport({
|
||||
* selector: '[unless]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'condition': 'unless'
|
||||
* }
|
||||
* })
|
||||
|
@ -837,19 +838,19 @@ export class Viewport extends Directive {
|
|||
@CONST()
|
||||
constructor({
|
||||
selector,
|
||||
bind,
|
||||
events,
|
||||
properties,
|
||||
hostListeners,
|
||||
lifecycle
|
||||
}:{
|
||||
selector:string,
|
||||
bind:any,
|
||||
properties:any,
|
||||
lifecycle:List
|
||||
}={})
|
||||
{
|
||||
super({
|
||||
selector: selector,
|
||||
bind: bind,
|
||||
events: events,
|
||||
properties: properties,
|
||||
hostListeners: hostListeners,
|
||||
lifecycle: lifecycle
|
||||
});
|
||||
}
|
||||
|
@ -891,7 +892,7 @@ export const onDestroy = "onDestroy";
|
|||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[class-set]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'propA': 'propA'
|
||||
* 'propB': 'propB'
|
||||
* },
|
||||
|
|
|
@ -3,7 +3,7 @@ import {ABSTRACT, CONST, Type} from 'angular2/src/facade/lang';
|
|||
/**
|
||||
* Declare the available HTML templates for an application.
|
||||
*
|
||||
* Each angular component requires a single `@Component` and at least one `@Template` annotation. The @Template
|
||||
* 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
|
||||
|
@ -17,8 +17,8 @@ import {ABSTRACT, CONST, Type} from 'angular2/src/facade/lang';
|
|||
* @Component({
|
||||
* selector: 'greet'
|
||||
* })
|
||||
* @Template({
|
||||
* inline: 'Hello {{name}}!'
|
||||
* @View({
|
||||
* template: 'Hello {{name}}!'
|
||||
* })
|
||||
* class Greet {
|
||||
* name: string;
|
||||
|
@ -31,35 +31,35 @@ import {ABSTRACT, CONST, Type} from 'angular2/src/facade/lang';
|
|||
*
|
||||
* @publicModule angular2/annotations
|
||||
*/
|
||||
export class Template {
|
||||
url:any; //string;
|
||||
inline:any; //string;
|
||||
export class View {
|
||||
templateUrl:any; //string;
|
||||
template:any; //string;
|
||||
directives:any; //List<Type>;
|
||||
formatters:any; //List<Type>;
|
||||
source:any;//List<Template>;
|
||||
source:any;//List<View>;
|
||||
locale:any; //string
|
||||
device:any; //string
|
||||
@CONST()
|
||||
constructor({
|
||||
url,
|
||||
inline,
|
||||
templateUrl,
|
||||
template,
|
||||
directives,
|
||||
formatters,
|
||||
source,
|
||||
locale,
|
||||
device
|
||||
}: {
|
||||
url: string,
|
||||
inline: string,
|
||||
templateUrl: string,
|
||||
template: string,
|
||||
directives: List<Type>,
|
||||
formatters: List<Type>,
|
||||
source: List<Template>,
|
||||
source: List<View>,
|
||||
locale: string,
|
||||
device: string
|
||||
})
|
||||
{
|
||||
this.url = url;
|
||||
this.inline = inline;
|
||||
this.templateUrl = templateUrl;
|
||||
this.template = template;
|
||||
this.directives = directives;
|
||||
this.formatters = formatters;
|
||||
this.source = source;
|
|
@ -3,23 +3,23 @@ import {DependencyAnnotation} from 'angular2/di';
|
|||
|
||||
/**
|
||||
* 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.
|
||||
*
|
||||
*
|
||||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[dependency]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'id':'dependency'
|
||||
* }
|
||||
* })
|
||||
* class Dependency {
|
||||
* id:string;
|
||||
* }
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
* @Decorator({
|
||||
* selector: '[my-directive]'
|
||||
* })
|
||||
|
@ -29,9 +29,9 @@ import {DependencyAnnotation} from 'angular2/di';
|
|||
* };
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* We use this with the following HTML template:
|
||||
*
|
||||
*
|
||||
* ```
|
||||
* <div dependency="1">
|
||||
* <div dependency="2" my-directive></div>
|
||||
|
@ -51,26 +51,26 @@ export class Parent extends DependencyAnnotation {
|
|||
|
||||
/**
|
||||
* Specifies that an injector should retrieve a dependency from any ancestor element.
|
||||
*
|
||||
*
|
||||
* An ancestor is any element between the parent element and shadow root.
|
||||
*
|
||||
*
|
||||
*
|
||||
* ## Example
|
||||
*
|
||||
*
|
||||
* Here is a simple directive that retrieves a dependency from an ancestor element.
|
||||
*
|
||||
*
|
||||
* ```
|
||||
* @Decorator({
|
||||
* selector: '[dependency]',
|
||||
* bind: {
|
||||
* properties: {
|
||||
* 'id':'dependency'
|
||||
* }
|
||||
* })
|
||||
* class Dependency {
|
||||
* id:string;
|
||||
* }
|
||||
*
|
||||
*
|
||||
*
|
||||
*
|
||||
* @Decorator({
|
||||
* selector: '[my-directive]'
|
||||
* })
|
||||
|
@ -82,7 +82,7 @@ export class Parent extends DependencyAnnotation {
|
|||
* ```
|
||||
*
|
||||
* We use this with the following HTML template:
|
||||
*
|
||||
*
|
||||
* ```
|
||||
* <div dependency="1">
|
||||
* <div dependency="2">
|
||||
|
@ -92,13 +92,13 @@ export class Parent extends DependencyAnnotation {
|
|||
* </div>
|
||||
* </div>
|
||||
* ```
|
||||
*
|
||||
*
|
||||
* The `@Ancestor()` annotation in our constructor forces the injector to retrieve the dependency from the
|
||||
* nearest ancestor element:
|
||||
* 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.
|
||||
*
|
||||
* - Next parent has the `Dependency` directive and so the dependency is satisfied.
|
||||
*
|
||||
* Angular injects `dependency=2`.
|
||||
*
|
||||
* @publicModule angular2/annotations
|
||||
|
|
|
@ -169,8 +169,8 @@ function _createVmZone(givenReporter:Function): VmTurnZone {
|
|||
* @Component({
|
||||
* selector: 'my-app'
|
||||
* })
|
||||
* @Template({
|
||||
* inline: 'Hello {{ name }}!'
|
||||
* @View({
|
||||
* template: 'Hello {{ name }}!'
|
||||
* })
|
||||
* class MyApp {
|
||||
* name:string;
|
||||
|
@ -191,8 +191,8 @@ function _createVmZone(givenReporter:Function): VmTurnZone {
|
|||
* 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 primordial injector) and configures the injector with the component's
|
||||
* `services`. Optionally, you can also override the injector configuration for an app by invoking
|
||||
* `bootstrap` with the `componentServiceBindings` argument.
|
||||
* `injectables`. 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.
|
||||
|
@ -234,7 +234,7 @@ function _createVmZone(givenReporter:Function): VmTurnZone {
|
|||
* # API
|
||||
* - [appComponentType]: The root component which should act as the application. This is a reference to a [Type]
|
||||
* which is annotated with `@Component(...)`.
|
||||
* - [componentServiceBindings]: An additional set of bindings that can be added to the [Component.services] to
|
||||
* - [componentInjectableBindings]: An additional set of bindings that can be added to the [Component.injectables] to
|
||||
* override default injection behavior.
|
||||
* - [errorReporter]: `function(exception:any, stackTrace:string)` a default error reporter for unhandled exceptions.
|
||||
*
|
||||
|
@ -243,7 +243,7 @@ function _createVmZone(givenReporter:Function): VmTurnZone {
|
|||
* @publicModule angular2/angular2
|
||||
*/
|
||||
export function bootstrap(appComponentType: Type,
|
||||
componentServiceBindings: List<Binding> = null,
|
||||
componentInjectableBindings: List<Binding> = null,
|
||||
errorReporter: Function = null): Promise<Injector> {
|
||||
BrowserDomAdapter.makeCurrent();
|
||||
var bootstrapProcess = PromiseWrapper.completer();
|
||||
|
@ -253,7 +253,7 @@ export function bootstrap(appComponentType: Type,
|
|||
// TODO(rado): prepopulate template cache, so applications with only
|
||||
// index.html and main.js are possible.
|
||||
|
||||
var appInjector = _createAppInjector(appComponentType, componentServiceBindings, zone);
|
||||
var appInjector = _createAppInjector(appComponentType, componentInjectableBindings, zone);
|
||||
|
||||
PromiseWrapper.then(appInjector.asyncGet(appChangeDetectorToken),
|
||||
(appChangeDetector) => {
|
||||
|
|
|
@ -5,10 +5,10 @@ import {List, ListWrapper, Map, MapWrapper} from 'angular2/src/facade/collection
|
|||
|
||||
import {DirectiveMetadataReader} from './directive_metadata_reader';
|
||||
import {Component, Viewport, DynamicComponent, Decorator} from '../annotations/annotations';
|
||||
import {ProtoView} from './view';
|
||||
import {AppProtoView} from './view';
|
||||
import {DirectiveBinding} from './element_injector';
|
||||
import {TemplateResolver} from './template_resolver';
|
||||
import {Template} from '../annotations/template';
|
||||
import {View} from '../annotations/view';
|
||||
import {ComponentUrlMapper} from './component_url_mapper';
|
||||
import {ProtoViewFactory} from './proto_view_factory';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
|
@ -16,7 +16,7 @@ import {UrlResolver} from 'angular2/src/services/url_resolver';
|
|||
import * as renderApi from 'angular2/src/render/api';
|
||||
|
||||
/**
|
||||
* Cache that stores the ProtoView of the template of a component.
|
||||
* Cache that stores the AppProtoView of the template of a component.
|
||||
* Used to prevent duplicate work and resolve cyclic dependencies.
|
||||
*/
|
||||
@Injectable()
|
||||
|
@ -26,11 +26,11 @@ export class CompilerCache {
|
|||
this._cache = MapWrapper.create();
|
||||
}
|
||||
|
||||
set(component:Type, protoView:ProtoView) {
|
||||
set(component:Type, protoView:AppProtoView) {
|
||||
MapWrapper.set(this._cache, component, protoView);
|
||||
}
|
||||
|
||||
get(component:Type):ProtoView {
|
||||
get(component:Type):AppProtoView {
|
||||
var result = MapWrapper.get(this._cache, component);
|
||||
return normalizeBlank(result);
|
||||
}
|
||||
|
@ -80,24 +80,24 @@ export class Compiler {
|
|||
|
||||
// Create a rootView as if the compiler encountered <rootcmp></rootcmp>.
|
||||
// Used for bootstrapping.
|
||||
compileRoot(elementOrSelector, componentTypeOrBinding:any):Promise<ProtoView> {
|
||||
compileRoot(elementOrSelector, componentTypeOrBinding:any):Promise<AppProtoView> {
|
||||
return this._renderer.createRootProtoView(elementOrSelector, 'root').then( (rootRenderPv) => {
|
||||
return this._compileNestedProtoViews(null, rootRenderPv, [this._bindDirective(componentTypeOrBinding)], true);
|
||||
});
|
||||
}
|
||||
|
||||
compile(component: Type):Promise<ProtoView> {
|
||||
compile(component: Type):Promise<AppProtoView> {
|
||||
var protoView = this._compile(this._bindDirective(component));
|
||||
return PromiseWrapper.isPromise(protoView) ? protoView : PromiseWrapper.resolve(protoView);
|
||||
}
|
||||
|
||||
// TODO(vicb): union type return ProtoView or Promise<ProtoView>
|
||||
// TODO(vicb): union type return AppProtoView or Promise<AppProtoView>
|
||||
_compile(componentBinding: DirectiveBinding) {
|
||||
var component = componentBinding.key.token;
|
||||
var protoView = this._compilerCache.get(component);
|
||||
if (isPresent(protoView)) {
|
||||
// The component has already been compiled into a ProtoView,
|
||||
// returns a plain ProtoView, not wrapped inside of a Promise.
|
||||
// The component has already been compiled into an AppProtoView,
|
||||
// returns a plain AppProtoView, not wrapped inside of a Promise.
|
||||
// Needed for recursive components.
|
||||
return protoView;
|
||||
}
|
||||
|
@ -124,7 +124,7 @@ export class Compiler {
|
|||
return pvPromise;
|
||||
}
|
||||
|
||||
// TODO(tbosch): union type return ProtoView or Promise<ProtoView>
|
||||
// TODO(tbosch): union type return AppProtoView or Promise<AppProtoView>
|
||||
_compileNestedProtoViews(componentBinding, renderPv, directives, isComponentRootView) {
|
||||
var nestedPVPromises = [];
|
||||
var protoView = this._protoViewFactory.createProtoView(componentBinding, renderPv, directives);
|
||||
|
@ -143,7 +143,7 @@ export class Compiler {
|
|||
var elementBinderDone = (nestedPv) => {
|
||||
elementBinder.nestedProtoView = nestedPv;
|
||||
// Can't set the parentProtoView for components,
|
||||
// as their ProtoView might be used in multiple other components.
|
||||
// as their AppProtoView might be used in multiple other components.
|
||||
nestedPv.parentProtoView = isPresent(nestedComponent) ? null : protoView;
|
||||
};
|
||||
var nestedCall = null;
|
||||
|
@ -180,23 +180,23 @@ export class Compiler {
|
|||
}
|
||||
}
|
||||
|
||||
_buildRenderTemplate(component, template, directives) {
|
||||
_buildRenderTemplate(component, view, directives) {
|
||||
var componentUrl = this._urlResolver.resolve(
|
||||
this._appUrl, this._componentUrlMapper.getUrl(component)
|
||||
);
|
||||
var templateAbsUrl = null;
|
||||
if (isPresent(template.url)) {
|
||||
templateAbsUrl = this._urlResolver.resolve(componentUrl, template.url);
|
||||
if (isPresent(view.templateUrl)) {
|
||||
templateAbsUrl = this._urlResolver.resolve(componentUrl, view.templateUrl);
|
||||
} else {
|
||||
// Note: If we have an inline template, we also need to send
|
||||
// the url for the component to the renderer so that it
|
||||
// is able to resolve urls in stylesheets.
|
||||
templateAbsUrl = componentUrl;
|
||||
}
|
||||
return new renderApi.Template({
|
||||
return new renderApi.ViewDefinition({
|
||||
componentId: stringify(component),
|
||||
absUrl: templateAbsUrl,
|
||||
inline: template.inline,
|
||||
template: view.template,
|
||||
directives: ListWrapper.map(directives, this._buildRenderDirective)
|
||||
});
|
||||
}
|
||||
|
@ -228,14 +228,14 @@ export class Compiler {
|
|||
type: renderType,
|
||||
selector: ann.selector,
|
||||
compileChildren: compileChildren,
|
||||
events: isPresent(ann.events) ? MapWrapper.createFromStringMap(ann.events) : null,
|
||||
bind: isPresent(ann.bind) ? MapWrapper.createFromStringMap(ann.bind) : null,
|
||||
hostListeners: isPresent(ann.hostListeners) ? MapWrapper.createFromStringMap(ann.hostListeners) : null,
|
||||
properties: isPresent(ann.properties) ? MapWrapper.createFromStringMap(ann.properties) : null,
|
||||
setters: setters,
|
||||
readAttributes: readAttributes
|
||||
});
|
||||
}
|
||||
|
||||
_flattenDirectives(template: Template):List<Type> {
|
||||
_flattenDirectives(template: View):List<Type> {
|
||||
if (isBlank(template.directives)) return [];
|
||||
|
||||
var directives = [];
|
||||
|
|
|
@ -36,7 +36,7 @@ export class DynamicComponentLoader {
|
|||
|
||||
var annotation = this._directiveMetadataReader.read(type).annotation;
|
||||
|
||||
var inj = this._componentAppInjector(location, injector, annotation.services);
|
||||
var inj = this._componentAppInjector(location, injector, annotation.injectables);
|
||||
|
||||
var hostEi = location.elementInjector;
|
||||
var hostView = location.hostView;
|
||||
|
@ -96,4 +96,4 @@ export class DynamicComponentLoader {
|
|||
throw new BaseException(`Could not load '${stringify(type)}' because it is not a component.`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -8,8 +8,8 @@ export class ElementBinder {
|
|||
protoElementInjector:eiModule.ProtoElementInjector;
|
||||
componentDirective:DirectiveBinding;
|
||||
viewportDirective:DirectiveBinding;
|
||||
nestedProtoView: viewModule.ProtoView;
|
||||
events:StringMap;
|
||||
nestedProtoView: viewModule.AppProtoView;
|
||||
hostListeners:StringMap;
|
||||
parent:ElementBinder;
|
||||
index:int;
|
||||
distanceToParent:int;
|
||||
|
@ -28,7 +28,7 @@ export class ElementBinder {
|
|||
this.index = index;
|
||||
this.distanceToParent = distanceToParent;
|
||||
// updated later when events are bound
|
||||
this.events = null;
|
||||
this.hostListeners = null;
|
||||
// updated later, so we are able to resolve cycles
|
||||
this.nestedProtoView = null;
|
||||
}
|
||||
|
|
|
@ -49,9 +49,9 @@ export class DirectiveRef extends ElementRef {
|
|||
}
|
||||
|
||||
export class ComponentRef extends DirectiveRef {
|
||||
componentView:viewModule.View;
|
||||
componentView:viewModule.AppView;
|
||||
|
||||
constructor(key:Key, elementInjector:ElementInjector, componentView:viewModule.View){
|
||||
constructor(key:Key, elementInjector:ElementInjector, componentView:viewModule.AppView){
|
||||
super(key, elementInjector);
|
||||
this.componentView = componentView;
|
||||
}
|
||||
|
@ -65,8 +65,8 @@ class StaticKeys {
|
|||
directiveRefId:number;
|
||||
|
||||
constructor() {
|
||||
//TODO: vsavkin Key.annotate(Key.get(View), 'static')
|
||||
this.viewId = Key.get(viewModule.View).id;
|
||||
//TODO: vsavkin Key.annotate(Key.get(AppView), 'static')
|
||||
this.viewId = Key.get(viewModule.AppView).id;
|
||||
this.ngElementId = Key.get(NgElement).id;
|
||||
this.viewContainerId = Key.get(ViewContainer).id;
|
||||
this.bindingPropagationConfigId = Key.get(BindingPropagationConfig).id;
|
||||
|
@ -267,7 +267,7 @@ export class DirectiveDependency extends Dependency {
|
|||
var p = ListWrapper.find(properties, (p) => p instanceof Attribute);
|
||||
return isPresent(p) ? p.attributeName : null;
|
||||
}
|
||||
|
||||
|
||||
static _query(properties) {
|
||||
var p = ListWrapper.find(properties, (p) => p instanceof Query);
|
||||
return isPresent(p) ? p.directive : null;
|
||||
|
@ -305,7 +305,7 @@ export class DirectiveBinding extends Binding {
|
|||
|
||||
// TODO(rado): benchmark and consider rolling in as ElementInjector fields.
|
||||
export class PreBuiltObjects {
|
||||
view:viewModule.View;
|
||||
view:viewModule.AppView;
|
||||
element:NgElement;
|
||||
viewContainer:ViewContainer;
|
||||
bindingPropagationConfig:BindingPropagationConfig;
|
||||
|
@ -362,7 +362,7 @@ export class ProtoElementInjector {
|
|||
_keyId9:int;
|
||||
parent:ProtoElementInjector;
|
||||
index:int;
|
||||
view:viewModule.View;
|
||||
view:viewModule.AppView;
|
||||
distanceToParent:number;
|
||||
attributes:Map;
|
||||
|
||||
|
@ -648,7 +648,7 @@ export class ElementInjector extends TreeNode {
|
|||
}
|
||||
|
||||
_isDynamicallyLoadedComponentKey(key:Key) {
|
||||
return isPresent(this._dynamicallyCreatedComponentBinding) && key.id ===
|
||||
return isPresent(this._dynamicallyCreatedComponentBinding) && key.id ===
|
||||
this._dynamicallyCreatedComponentBinding.key.id;
|
||||
}
|
||||
|
||||
|
@ -910,7 +910,7 @@ export class ElementInjector extends TreeNode {
|
|||
|
||||
_getPreBuiltObjectByKeyId(keyId:int) {
|
||||
var staticKeys = StaticKeys.instance();
|
||||
// TODO: View should not be injectable. Remove it.
|
||||
// TODO: AppView should not be injectable. Remove it.
|
||||
if (keyId === staticKeys.viewId) return this._preBuiltObjects.view;
|
||||
if (keyId === staticKeys.ngElementId) return this._preBuiltObjects.element;
|
||||
if (keyId === staticKeys.viewContainerId) return this._preBuiltObjects.viewContainer;
|
||||
|
|
|
@ -12,7 +12,7 @@ import {DirectDomViewRef} from 'angular2/src/render/dom/direct_dom_renderer';
|
|||
* @publicModule angular2/angular2
|
||||
*/
|
||||
export class NgElement {
|
||||
_view:viewModule.View;
|
||||
_view:viewModule.AppView;
|
||||
_boundElementIndex:number;
|
||||
|
||||
constructor(view, boundElementIndex) {
|
||||
|
@ -31,4 +31,4 @@ export class NgElement {
|
|||
getAttribute(name:string) {
|
||||
return normalizeBlank(DOM.getAttribute(this.domElement, name));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -7,7 +7,7 @@ import {ChangeDetection} from 'angular2/change_detection';
|
|||
import {Component, Viewport, DynamicComponent} from '../annotations/annotations';
|
||||
|
||||
import * as renderApi from 'angular2/src/render/api';
|
||||
import {ProtoView} from './view';
|
||||
import {AppProtoView} from './view';
|
||||
import {ProtoElementInjector, DirectiveBinding} from './element_injector';
|
||||
|
||||
@Injectable()
|
||||
|
@ -20,7 +20,7 @@ export class ProtoViewFactory {
|
|||
this._renderer = renderer;
|
||||
}
|
||||
|
||||
createProtoView(componentBinding:DirectiveBinding, renderProtoView: renderApi.ProtoView, directives:List<DirectiveBinding>):ProtoView {
|
||||
createProtoView(componentBinding:DirectiveBinding, renderProtoView: renderApi.ProtoViewDto, directives:List<DirectiveBinding>):AppProtoView {
|
||||
var protoChangeDetector;
|
||||
if (isBlank(componentBinding)) {
|
||||
protoChangeDetector = this._changeDetection.createProtoChangeDetector('root', null);
|
||||
|
@ -30,7 +30,7 @@ export class ProtoViewFactory {
|
|||
'dummy', componentAnnotation.changeDetection
|
||||
);
|
||||
}
|
||||
var protoView = new ProtoView(this._renderer, renderProtoView.render, protoChangeDetector);
|
||||
var protoView = new AppProtoView(this._renderer, renderProtoView.render, protoChangeDetector);
|
||||
|
||||
for (var i=0; i<renderProtoView.elementBinders.length; i++) {
|
||||
var renderElementBinder = renderProtoView.elementBinders[i];
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import {Injectable} from 'angular2/di';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {Type, stringify, isBlank, BaseException} from 'angular2/src/facade/lang';
|
||||
import {Map, MapWrapper, List, ListWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -15,22 +15,22 @@ export class TemplateResolver {
|
|||
this._cache = MapWrapper.create();
|
||||
}
|
||||
|
||||
resolve(component: Type): Template {
|
||||
var template = MapWrapper.get(this._cache, component);
|
||||
resolve(component: Type): View {
|
||||
var view = MapWrapper.get(this._cache, component);
|
||||
|
||||
if (isBlank(template)) {
|
||||
template = this._resolve(component);
|
||||
MapWrapper.set(this._cache, component, template);
|
||||
if (isBlank(view)) {
|
||||
view = this._resolve(component);
|
||||
MapWrapper.set(this._cache, component, view);
|
||||
}
|
||||
|
||||
return template;
|
||||
return view;
|
||||
}
|
||||
|
||||
_resolve(component: Type) {
|
||||
var annotations = reflector.annotations(component);
|
||||
for (var i = 0; i < annotations.length; i++) {
|
||||
var annotation = annotations[i];
|
||||
if (annotation instanceof Template) {
|
||||
if (annotation instanceof View) {
|
||||
return annotation;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -18,21 +18,22 @@ import * as renderApi from 'angular2/src/render/api';
|
|||
@IMPLEMENTS(ChangeDispatcher)
|
||||
// TODO(tbosch): this is not supported in dart2js (no '.' is allowed)
|
||||
// @IMPLEMENTS(renderApi.EventDispatcher)
|
||||
export class View {
|
||||
export class AppView {
|
||||
render:renderApi.ViewRef;
|
||||
/// This list matches the _nodes list. It is sparse, since only Elements have ElementInjector
|
||||
rootElementInjectors:List<ElementInjector>;
|
||||
elementInjectors:List<ElementInjector>;
|
||||
changeDetector:ChangeDetector;
|
||||
componentChildViews: List<View>;
|
||||
componentChildViews: List<AppView>;
|
||||
viewContainers: List<ViewContainer>;
|
||||
preBuiltObjects: List<PreBuiltObjects>;
|
||||
proto: ProtoView;
|
||||
proto: AppProtoView;
|
||||
|
||||
/**
|
||||
* The context against which data-binding expressions in this view are evaluated against.
|
||||
* This is always a component instance.
|
||||
*/
|
||||
|
||||
context: any;
|
||||
|
||||
/**
|
||||
|
@ -42,7 +43,7 @@ export class View {
|
|||
*/
|
||||
locals:Locals;
|
||||
|
||||
constructor(proto:ProtoView, protoLocals:Map) {
|
||||
constructor(proto:AppProtoView, protoLocals:Map) {
|
||||
this.render = null;
|
||||
this.proto = proto;
|
||||
this.changeDetector = null;
|
||||
|
@ -150,9 +151,9 @@ export class View {
|
|||
|
||||
// shadowDomAppInjector
|
||||
if (isPresent(componentDirective)) {
|
||||
var services = componentDirective.annotation.services;
|
||||
if (isPresent(services))
|
||||
shadowDomAppInjector = appInjector.createChild(services);
|
||||
var injectables = componentDirective.annotation.injectables;
|
||||
if (isPresent(injectables))
|
||||
shadowDomAppInjector = appInjector.createChild(injectables);
|
||||
else {
|
||||
shadowDomAppInjector = appInjector;
|
||||
}
|
||||
|
@ -249,13 +250,13 @@ export class View {
|
|||
this.proto.renderer.setText(this.render, b.elementIndex, currentValue);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
directive(directive:DirectiveRecord) {
|
||||
var elementInjector:ElementInjector = this.elementInjectors[directive.elementIndex];
|
||||
return elementInjector.getDirectiveAtIndex(directive.directiveIndex);
|
||||
}
|
||||
|
||||
addComponentChildView(view:View) {
|
||||
addComponentChildView(view:AppView) {
|
||||
ListWrapper.push(this.componentChildViews, view);
|
||||
this.changeDetector.addShadowDomChild(view.changeDetector);
|
||||
}
|
||||
|
@ -269,8 +270,8 @@ export class View {
|
|||
// queuing up and firing.
|
||||
if (this.hydrated()) {
|
||||
var elBinder = this.proto.elementBinders[elementIndex];
|
||||
if (isBlank(elBinder.events)) return;
|
||||
var eventMap = elBinder.events[eventName];
|
||||
if (isBlank(elBinder.hostListeners)) return;
|
||||
var eventMap = elBinder.hostListeners[eventName];
|
||||
if (isBlank(eventName)) return;
|
||||
MapWrapper.forEach(eventMap, (expr, directiveIndex) => {
|
||||
var context;
|
||||
|
@ -289,14 +290,14 @@ export class View {
|
|||
*
|
||||
* @publicModule angular2/template
|
||||
*/
|
||||
export class ProtoView {
|
||||
export class AppProtoView {
|
||||
elementBinders:List<ElementBinder>;
|
||||
protoChangeDetector:ProtoChangeDetector;
|
||||
variableBindings: Map;
|
||||
protoLocals:Map;
|
||||
textNodesWithBindingCount:int;
|
||||
bindings:List;
|
||||
parentProtoView:ProtoView;
|
||||
parentProtoView:AppProtoView;
|
||||
_variableBindings:List;
|
||||
|
||||
_directiveRecordsMap:Map;
|
||||
|
@ -323,8 +324,8 @@ export class ProtoView {
|
|||
}
|
||||
|
||||
//TODO: Tobias or Victor. Moving it into the constructor.
|
||||
// this work should be done the constructor of ProtoView once we separate
|
||||
// ProtoView and ProtoViewBuilder
|
||||
// this work should be done the constructor of AppProtoView once we separate
|
||||
// AppProtoView and ProtoViewBuilder
|
||||
getVariableBindings() {
|
||||
if (isPresent(this._variableBindings)) {
|
||||
return this._variableBindings;
|
||||
|
@ -342,7 +343,7 @@ export class ProtoView {
|
|||
|
||||
//TODO: Tobias or Victor. Moving it into the constructor.
|
||||
// this work should be done the constructor of ProtoView once we separate
|
||||
// ProtoView and ProtoViewBuilder
|
||||
// AppProtoView and ProtoViewBuilder
|
||||
getdirectiveRecords() {
|
||||
if (isPresent(this._directiveRecords)) {
|
||||
return this._directiveRecords;
|
||||
|
@ -408,10 +409,10 @@ export class ProtoView {
|
|||
*/
|
||||
bindEvent(eventName:string, expression:AST, directiveIndex: int = -1) {
|
||||
var elBinder = this.elementBinders[this.elementBinders.length - 1];
|
||||
var events = elBinder.events;
|
||||
var events = elBinder.hostListeners;
|
||||
if (isBlank(events)) {
|
||||
events = StringMapWrapper.create();
|
||||
elBinder.events = events;
|
||||
elBinder.hostListeners = events;
|
||||
}
|
||||
var event = StringMapWrapper.get(events, eventName);
|
||||
if (isBlank(event)) {
|
||||
|
@ -449,4 +450,4 @@ export class ProtoView {
|
|||
|
||||
return MapWrapper.get(this._directiveRecordsMap, id);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,16 +14,16 @@ import * as vfModule from './view_factory';
|
|||
export class ViewContainer {
|
||||
render:renderApi.ViewContainerRef;
|
||||
viewFactory: vfModule.ViewFactory;
|
||||
parentView: viewModule.View;
|
||||
defaultProtoView: viewModule.ProtoView;
|
||||
_views: List<viewModule.View>;
|
||||
parentView: viewModule.AppView;
|
||||
defaultProtoView: viewModule.AppProtoView;
|
||||
_views: List<viewModule.AppView>;
|
||||
elementInjector: eiModule.ElementInjector;
|
||||
appInjector: Injector;
|
||||
hostElementInjector: eiModule.ElementInjector;
|
||||
|
||||
constructor(viewFactory:vfModule.ViewFactory,
|
||||
parentView: viewModule.View,
|
||||
defaultProtoView: viewModule.ProtoView,
|
||||
parentView: viewModule.AppView,
|
||||
defaultProtoView: viewModule.AppProtoView,
|
||||
elementInjector: eiModule.ElementInjector) {
|
||||
this.viewFactory = viewFactory;
|
||||
this.render = null;
|
||||
|
@ -67,7 +67,7 @@ export class ViewContainer {
|
|||
}
|
||||
}
|
||||
|
||||
get(index: number): viewModule.View {
|
||||
get(index: number): viewModule.AppView {
|
||||
return this._views[index];
|
||||
}
|
||||
|
||||
|
@ -86,7 +86,7 @@ export class ViewContainer {
|
|||
|
||||
// TODO(rado): profile and decide whether bounds checks should be added
|
||||
// to the methods below.
|
||||
create(atIndex=-1): viewModule.View {
|
||||
create(atIndex=-1): viewModule.AppView {
|
||||
if (!this.hydrated()) throw new BaseException(
|
||||
'Cannot create views on a dehydrated ViewContainer');
|
||||
var newView = this.viewFactory.getView(this.defaultProtoView);
|
||||
|
@ -101,13 +101,13 @@ export class ViewContainer {
|
|||
return newView;
|
||||
}
|
||||
|
||||
insert(view, atIndex=-1): viewModule.View {
|
||||
insert(view, atIndex=-1): viewModule.AppView {
|
||||
this._insertWithoutRender(view, atIndex);
|
||||
this.defaultProtoView.renderer.insertViewIntoContainer(this.render, view.render, atIndex);
|
||||
return view;
|
||||
}
|
||||
|
||||
_insertWithoutRender(view, atIndex=-1): viewModule.View {
|
||||
_insertWithoutRender(view, atIndex=-1): viewModule.AppView {
|
||||
if (atIndex == -1) atIndex = this._views.length;
|
||||
ListWrapper.insert(this._views, atIndex, view);
|
||||
this.parentView.changeDetector.addChild(view.changeDetector);
|
||||
|
@ -128,7 +128,7 @@ export class ViewContainer {
|
|||
* 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.
|
||||
*/
|
||||
detach(atIndex=-1): viewModule.View {
|
||||
detach(atIndex=-1): viewModule.AppView {
|
||||
if (atIndex == -1) atIndex = this._views.length - 1;
|
||||
var detachedView = this.get(atIndex);
|
||||
ListWrapper.removeAt(this._views, atIndex);
|
||||
|
|
|
@ -13,14 +13,14 @@ export const VIEW_POOL_CAPACITY = 'ViewFactory.viewPoolCapacity';
|
|||
@Injectable()
|
||||
export class ViewFactory {
|
||||
_poolCapacity:number;
|
||||
_pooledViews:List<viewModule.View>;
|
||||
_pooledViews:List<viewModule.AppView>;
|
||||
|
||||
constructor(@Inject(VIEW_POOL_CAPACITY) capacity) {
|
||||
this._poolCapacity = capacity;
|
||||
this._pooledViews = ListWrapper.create();
|
||||
}
|
||||
|
||||
getView(protoView:viewModule.ProtoView):viewModule.View {
|
||||
getView(protoView:viewModule.AppProtoView):viewModule.AppView {
|
||||
// TODO(tbosch): benchmark this scanning of views and maybe
|
||||
// replace it with a fancy LRU Map/List combination...
|
||||
var view;
|
||||
|
@ -36,7 +36,7 @@ export class ViewFactory {
|
|||
return view;
|
||||
}
|
||||
|
||||
returnView(view:viewModule.View) {
|
||||
returnView(view:viewModule.AppView) {
|
||||
if (view.hydrated()) {
|
||||
throw new BaseException('Only dehydrated Views can be put back into the pool!');
|
||||
}
|
||||
|
@ -46,8 +46,8 @@ export class ViewFactory {
|
|||
}
|
||||
}
|
||||
|
||||
_createView(protoView:viewModule.ProtoView): viewModule.View {
|
||||
var view = new viewModule.View(protoView, protoView.protoLocals);
|
||||
_createView(protoView:viewModule.AppProtoView): viewModule.AppView {
|
||||
var view = new viewModule.AppView(protoView, protoView.protoLocals);
|
||||
var changeDetector = protoView.protoChangeDetector.instantiate(view, protoView.bindings,
|
||||
protoView.getVariableBindings(), protoView.getdirectiveRecords());
|
||||
|
||||
|
@ -106,4 +106,4 @@ export class ViewFactory {
|
|||
return view;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@ import {NgElement} from 'angular2/src/core/compiler/ng_element';
|
|||
|
||||
@Decorator({
|
||||
selector: '[class]',
|
||||
bind: {
|
||||
properties: {
|
||||
'iterableChanges': 'class | keyValDiff'
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {Viewport} from 'angular2/src/core/annotations/annotations';
|
||||
import {ViewContainer} from 'angular2/src/core/compiler/view_container';
|
||||
import {View} from 'angular2/src/core/compiler/view';
|
||||
import {AppView} from 'angular2/src/core/compiler/view';
|
||||
import {isPresent, isBlank} from 'angular2/src/facade/lang';
|
||||
import {ListWrapper} from 'angular2/src/facade/collection';
|
||||
|
||||
|
@ -38,7 +38,7 @@ import {ListWrapper} from 'angular2/src/facade/collection';
|
|||
*/
|
||||
@Viewport({
|
||||
selector: '[for][of]',
|
||||
bind: {
|
||||
properties: {
|
||||
'iterableChanges': 'of | iterableDiff'
|
||||
}
|
||||
})
|
||||
|
@ -114,7 +114,7 @@ export class For {
|
|||
}
|
||||
|
||||
class RecordViewTuple {
|
||||
view: View;
|
||||
view: AppView;
|
||||
record: any;
|
||||
constructor(record, view) {
|
||||
this.record = record;
|
||||
|
|
|
@ -26,7 +26,7 @@ import {isBlank} from 'angular2/src/facade/lang';
|
|||
*/
|
||||
@Viewport({
|
||||
selector: '[if]',
|
||||
bind: {
|
||||
properties: {
|
||||
'condition': 'if'
|
||||
}
|
||||
})
|
||||
|
|
|
@ -33,7 +33,7 @@ import {Parent} from 'angular2/src/core/annotations/visibility';
|
|||
*/
|
||||
@Decorator({
|
||||
selector: '[switch]',
|
||||
bind: {
|
||||
properties: {
|
||||
'value': 'switch'
|
||||
}
|
||||
})
|
||||
|
@ -146,7 +146,7 @@ export class Switch {
|
|||
*/
|
||||
@Viewport({
|
||||
selector: '[switch-when]',
|
||||
bind: {
|
||||
properties: {
|
||||
'when' : 'switch-when'
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import {Template, Component, Decorator, Ancestor, onChange, PropertySetter} from 'angular2/angular2';
|
||||
import {View, Component, Decorator, Ancestor, onChange, PropertySetter} from 'angular2/angular2';
|
||||
import {Optional} from 'angular2/di';
|
||||
import {isBlank, isPresent, isString, CONST} from 'angular2/src/facade/lang';
|
||||
import {StringMapWrapper, ListWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -15,7 +15,7 @@ import {Validators} from './validators';
|
|||
*/
|
||||
@Decorator({
|
||||
selector: '[control]',
|
||||
events: {
|
||||
hostListeners: {
|
||||
'change' : 'onChange($event.target.value)',
|
||||
'input' : 'onChange($event.target.value)'
|
||||
}
|
||||
|
@ -39,7 +39,7 @@ export class DefaultValueAccessor {
|
|||
*/
|
||||
@Decorator({
|
||||
selector: 'input[type=checkbox][control]',
|
||||
events: {
|
||||
hostListeners: {
|
||||
'change' : 'onChange($event.target.checked)'
|
||||
}
|
||||
})
|
||||
|
@ -64,7 +64,7 @@ export class CheckboxControlValueAccessor {
|
|||
@Decorator({
|
||||
lifecycle: [onChange],
|
||||
selector: '[control]',
|
||||
bind: {
|
||||
properties: {
|
||||
'controlOrName' : 'control'
|
||||
}
|
||||
})
|
||||
|
@ -123,7 +123,7 @@ export class ControlDirective {
|
|||
*/
|
||||
@Decorator({
|
||||
selector: '[control-group]',
|
||||
bind: {
|
||||
properties: {
|
||||
'controlGroup' : 'control-group'
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
import {Map, MapWrapper, ListWrapper} from 'angular2/src/facade/collection';
|
||||
import {Type, isPresent, BaseException, stringify, isBlank} from 'angular2/src/facade/lang';
|
||||
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {TemplateResolver} from 'angular2/src/core/compiler/template_resolver';
|
||||
|
||||
export class MockTemplateResolver extends TemplateResolver {
|
||||
_templates: Map<Type, Template>;
|
||||
_templates: Map<Type, View>;
|
||||
_inlineTemplates: Map<Type, string>;
|
||||
_templateCache: Map<Type, Template>;
|
||||
_templateCache: Map<Type, View>;
|
||||
_directiveOverrides: Map<Type, Type>;
|
||||
|
||||
constructor() {
|
||||
|
@ -19,14 +19,14 @@ export class MockTemplateResolver extends TemplateResolver {
|
|||
}
|
||||
|
||||
/**
|
||||
* Overrides the [Template] for a component.
|
||||
* Overrides the [View] for a component.
|
||||
*
|
||||
* @param {Type} component
|
||||
* @param {Template} template
|
||||
* @param {ViewDefinition} view
|
||||
*/
|
||||
setTemplate(component: Type, template: Template): void {
|
||||
setView(component: Type, view: View): void {
|
||||
this._checkOverrideable(component);
|
||||
MapWrapper.set(this._templates, component, template);
|
||||
MapWrapper.set(this._templates, component, view);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -41,7 +41,7 @@ export class MockTemplateResolver extends TemplateResolver {
|
|||
}
|
||||
|
||||
/**
|
||||
* Overrides a directive from the component [Template].
|
||||
* Overrides a directive from the component [View].
|
||||
*
|
||||
* @param {Type} component
|
||||
* @param {Type} from
|
||||
|
@ -61,29 +61,29 @@ export class MockTemplateResolver extends TemplateResolver {
|
|||
}
|
||||
|
||||
/**
|
||||
* Returns the [Template] for a component:
|
||||
* - Set the [Template] to the overridden template when it exists or fallback to the default
|
||||
* [TemplateResolver], see [setTemplate]
|
||||
* Returns the [View] for a component:
|
||||
* - Set the [View] to the overridden template when it exists or fallback to the default
|
||||
* [TemplateResolver], see [setView]
|
||||
* - Override the directives, see [overrideTemplateDirective]
|
||||
* - Override the template definition, see [setInlineTemplate]
|
||||
* - Override the @View definition, see [setInlineTemplate]
|
||||
*
|
||||
* @param component
|
||||
* @returns {Template}
|
||||
* @returns {ViewDefinition}
|
||||
*/
|
||||
resolve(component: Type): Template {
|
||||
var template = MapWrapper.get(this._templateCache, component);
|
||||
if (isPresent(template)) return template;
|
||||
resolve(component: Type): View {
|
||||
var view = MapWrapper.get(this._templateCache, component);
|
||||
if (isPresent(view)) return view;
|
||||
|
||||
template = MapWrapper.get(this._templates, component);
|
||||
if (isBlank(template)) {
|
||||
template = super.resolve(component);
|
||||
view = MapWrapper.get(this._templates, component);
|
||||
if (isBlank(view)) {
|
||||
view = super.resolve(component);
|
||||
}
|
||||
|
||||
var directives = template.directives;
|
||||
var directives = view.directives;
|
||||
var overrides = MapWrapper.get(this._directiveOverrides, component);
|
||||
|
||||
if (isPresent(overrides) && isPresent(directives)) {
|
||||
directives = ListWrapper.clone(template.directives);
|
||||
directives = ListWrapper.clone(view.directives);
|
||||
MapWrapper.forEach(overrides, (to, from) => {
|
||||
var srcIndex = directives.indexOf(from);
|
||||
if (srcIndex == -1) {
|
||||
|
@ -91,36 +91,36 @@ export class MockTemplateResolver extends TemplateResolver {
|
|||
}
|
||||
directives[srcIndex] = to;
|
||||
});
|
||||
template = new Template({
|
||||
inline: template.inline,
|
||||
url: template.url,
|
||||
view = new View({
|
||||
template: view.template,
|
||||
templateUrl: view.templateUrl,
|
||||
directives: directives,
|
||||
formatters: template.formatters,
|
||||
source: template.source,
|
||||
locale: template.locale,
|
||||
device: template.device,
|
||||
formatters: view.formatters,
|
||||
source: view.source,
|
||||
locale: view.locale,
|
||||
device: view.device
|
||||
});
|
||||
}
|
||||
|
||||
var inlineTemplate = MapWrapper.get(this._inlineTemplates, component);
|
||||
if (isPresent(inlineTemplate)) {
|
||||
template = new Template({
|
||||
inline: inlineTemplate,
|
||||
url: null,
|
||||
directives: template.directives,
|
||||
formatters: template.formatters,
|
||||
source: template.source,
|
||||
locale: template.locale,
|
||||
device: template.device,
|
||||
view = new View({
|
||||
template: inlineTemplate,
|
||||
templateUrl: null,
|
||||
directives: view.directives,
|
||||
formatters: view.formatters,
|
||||
source: view.source,
|
||||
locale: view.locale,
|
||||
device: view.device
|
||||
});
|
||||
}
|
||||
|
||||
MapWrapper.set(this._templateCache, component, template);
|
||||
return template;
|
||||
MapWrapper.set(this._templateCache, component, view);
|
||||
return view;
|
||||
}
|
||||
|
||||
/**
|
||||
* Once a component has been compiled, the ProtoView is stored in the compiler cache.
|
||||
* Once a component has been compiled, the AppProtoView is stored in the compiler cache.
|
||||
*
|
||||
* Then it should not be possible to override the component configuration after the component
|
||||
* has been compiled.
|
||||
|
|
|
@ -20,7 +20,7 @@ export class ElementBinder {
|
|||
parentIndex:number;
|
||||
distanceToParent:number;
|
||||
directives:List<DirectiveBinder>;
|
||||
nestedProtoView:ProtoView;
|
||||
nestedProtoView:ProtoViewDto;
|
||||
propertyBindings: Map<string, ASTWithSource>;
|
||||
variableBindings: Map<string, ASTWithSource>;
|
||||
// Note: this contains a preprocessed AST
|
||||
|
@ -51,7 +51,7 @@ export class ElementBinder {
|
|||
}
|
||||
|
||||
export class DirectiveBinder {
|
||||
// Index into the array of directives in the Template instance
|
||||
// Index into the array of directives in the View instance
|
||||
directiveIndex:any;
|
||||
propertyBindings: Map<string, ASTWithSource>;
|
||||
// Note: this contains a preprocessed AST
|
||||
|
@ -67,7 +67,7 @@ export class DirectiveBinder {
|
|||
}
|
||||
}
|
||||
|
||||
export class ProtoView {
|
||||
export class ProtoViewDto {
|
||||
render: ProtoViewRef;
|
||||
elementBinders:List<ElementBinder>;
|
||||
variableBindings: Map<string, string>;
|
||||
|
@ -86,27 +86,27 @@ export class DirectiveMetadata {
|
|||
id:any;
|
||||
selector:string;
|
||||
compileChildren:boolean;
|
||||
events:Map<string, string>;
|
||||
bind:Map<string, string>;
|
||||
hostListeners:Map<string, string>;
|
||||
properties:Map<string, string>;
|
||||
setters:List<string>;
|
||||
readAttributes:List<string>;
|
||||
type:number;
|
||||
constructor({id, selector, compileChildren, events, bind, setters, readAttributes, type}) {
|
||||
constructor({id, selector, compileChildren, hostListeners, properties, setters, readAttributes, type}) {
|
||||
this.id = id;
|
||||
this.selector = selector;
|
||||
this.compileChildren = isPresent(compileChildren) ? compileChildren : true;
|
||||
this.events = events;
|
||||
this.bind = bind;
|
||||
this.hostListeners = hostListeners;
|
||||
this.properties = properties;
|
||||
this.setters = setters;
|
||||
this.readAttributes = readAttributes;
|
||||
this.type = type;
|
||||
}
|
||||
}
|
||||
|
||||
// An opaque reference to a ProtoView
|
||||
// An opaque reference to a RenderProtoView
|
||||
export class ProtoViewRef {}
|
||||
|
||||
// An opaque reference to a View
|
||||
// An opaque reference to a RenderView
|
||||
export class ViewRef {}
|
||||
|
||||
export class ViewContainerRef {
|
||||
|
@ -118,43 +118,43 @@ export class ViewContainerRef {
|
|||
}
|
||||
}
|
||||
|
||||
export class Template {
|
||||
export class ViewDefinition {
|
||||
componentId: string;
|
||||
absUrl: string;
|
||||
inline: string;
|
||||
template: string;
|
||||
directives: List<DirectiveMetadata>;
|
||||
|
||||
constructor({componentId, absUrl, inline, directives}) {
|
||||
constructor({componentId, absUrl, template, directives}) {
|
||||
this.componentId = componentId;
|
||||
this.absUrl = absUrl;
|
||||
this.inline = inline;
|
||||
this.template = template;
|
||||
this.directives = directives;
|
||||
}
|
||||
}
|
||||
|
||||
export class Renderer {
|
||||
/**
|
||||
* Compiles a single ProtoView. Non recursive so that
|
||||
* Compiles a single RenderProtoView. Non recursive so that
|
||||
* we don't need to serialize all possible components over the wire,
|
||||
* but only the needed ones based on previous calls.
|
||||
*/
|
||||
compile(template:Template):Promise<ProtoView> { return null; }
|
||||
compile(template:ViewDefinition):Promise<ProtoViewDto> { return null; }
|
||||
|
||||
/**
|
||||
* Sets the preset nested components,
|
||||
* which will be instantiated when this protoView is instantiated.
|
||||
* Note: We can't create new ProtoViewRefs here as we need to support cycles / recursive components.
|
||||
* @param {List<ProtoViewRef>} protoViewRefs
|
||||
* ProtoView for every element with a component in this protoView or in a view container's protoView
|
||||
* RenderProtoView for every element with a component in this protoView or in a view container's protoView
|
||||
*/
|
||||
mergeChildComponentProtoViews(protoViewRef:ProtoViewRef, componentProtoViewRefs:List<ProtoViewRef>) { return null; }
|
||||
|
||||
/**
|
||||
* Creats a ProtoView that will create a root view for the given element,
|
||||
* Creats a RenderProtoView that will create a root view for the given element,
|
||||
* i.e. it will not clone the element but only attach other proto views to it.
|
||||
* Contains a single nested component with the given componentId.
|
||||
*/
|
||||
createRootProtoView(selectorOrElement, componentId):Promise<ProtoView> { return null; }
|
||||
createRootProtoView(selectorOrElement, componentId):Promise<ProtoViewDto> { return null; }
|
||||
|
||||
/**
|
||||
* Creates a view and all of its nested child components.
|
||||
|
@ -182,7 +182,7 @@ export class Renderer {
|
|||
/**
|
||||
* Sets a property on an element.
|
||||
* Note: This will fail if the property was not mentioned previously as a propertySetter
|
||||
* in the Template.
|
||||
* in the View.
|
||||
*/
|
||||
setElementProperty(view:ViewRef, elementIndex:number, propertyName:string, propertyValue:any):void {}
|
||||
|
||||
|
@ -195,7 +195,7 @@ export class Renderer {
|
|||
/**
|
||||
* This will set the value for a text node.
|
||||
* Note: This needs to be separate from setElementProperty as we don't have ElementBinders
|
||||
* for text nodes in the ProtoView either.
|
||||
* for text nodes in the RenderProtoView either.
|
||||
*/
|
||||
setText(view:ViewRef, textNodeIndex:number, text:string):void {}
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@ import {List} from 'angular2/src/facade/collection';
|
|||
import {Promise} from 'angular2/src/facade/async';
|
||||
|
||||
import {Parser} from 'angular2/change_detection';
|
||||
import {Template} from '../../api';
|
||||
import {ViewDefinition} from '../../api';
|
||||
import {CompileStep} from './compile_step';
|
||||
import {PropertyBindingParser} from './property_binding_parser';
|
||||
import {TextInterpolationParser} from './text_interpolation_parser';
|
||||
|
@ -12,7 +12,7 @@ import {ShadowDomCompileStep} from '../shadow_dom/shadow_dom_compile_step';
|
|||
import {ShadowDomStrategy} from '../shadow_dom/shadow_dom_strategy';
|
||||
|
||||
export class CompileStepFactory {
|
||||
createSteps(template: Template, subTaskPromises: List<Promise>):List<CompileStep> {
|
||||
createSteps(template: ViewDefinition, subTaskPromises: List<Promise>):List<CompileStep> {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
@ -27,7 +27,7 @@ export class DefaultStepFactory extends CompileStepFactory {
|
|||
this._shadowDomStrategy = shadowDomStrategy;
|
||||
}
|
||||
|
||||
createSteps(template: Template, subTaskPromises: List<Promise>) {
|
||||
createSteps(template: ViewDefinition, subTaskPromises: List<Promise>) {
|
||||
return [
|
||||
new ViewSplitter(this._parser),
|
||||
new PropertyBindingParser(this._parser),
|
||||
|
@ -36,4 +36,4 @@ export class DefaultStepFactory extends CompileStepFactory {
|
|||
new ShadowDomCompileStep(this._shadowDomStrategy, template, subTaskPromises)
|
||||
];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@ import {Injectable} from 'angular2/di';
|
|||
import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
|
||||
import {BaseException} from 'angular2/src/facade/lang';
|
||||
|
||||
import {Template, ProtoView} from '../../api';
|
||||
import {ViewDefinition, ProtoViewDto} from '../../api';
|
||||
import {CompilePipeline} from './compile_pipeline';
|
||||
import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader';
|
||||
import {CompileStepFactory, DefaultStepFactory} from './compile_step_factory';
|
||||
|
@ -24,7 +24,7 @@ export class Compiler {
|
|||
this._stepFactory = stepFactory;
|
||||
}
|
||||
|
||||
compile(template: Template):Promise<ProtoView> {
|
||||
compile(template: ViewDefinition):Promise<ProtoViewDto> {
|
||||
var tplPromise = this._templateLoader.load(template);
|
||||
return PromiseWrapper.then(tplPromise,
|
||||
(el) => this._compileTemplate(template, el),
|
||||
|
@ -32,7 +32,7 @@ export class Compiler {
|
|||
);
|
||||
}
|
||||
|
||||
_compileTemplate(template: Template, tplElement):Promise<ProtoView> {
|
||||
_compileTemplate(template: ViewDefinition, tplElement):Promise<ProtoViewDto> {
|
||||
var subTaskPromises = [];
|
||||
var pipeline = new CompilePipeline(this._stepFactory.createSteps(template, subTaskPromises));
|
||||
var compileElements;
|
||||
|
@ -54,4 +54,4 @@ export class DefaultCompiler extends Compiler {
|
|||
constructor(parser:Parser, shadowDomStrategy:ShadowDomStrategy, templateLoader: TemplateLoader) {
|
||||
super(new DefaultStepFactory(parser, shadowDomStrategy), templateLoader);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -58,13 +58,13 @@ export class DirectiveParser extends CompileStep {
|
|||
var directive = this._directives[directiveIndex];
|
||||
var directiveBinder = elementBinder.bindDirective(directiveIndex);
|
||||
current.compileChildren = current.compileChildren && directive.compileChildren;
|
||||
if (isPresent(directive.bind)) {
|
||||
MapWrapper.forEach(directive.bind, (bindConfig, dirProperty) => {
|
||||
if (isPresent(directive.properties)) {
|
||||
MapWrapper.forEach(directive.properties, (bindConfig, dirProperty) => {
|
||||
this._bindDirectiveProperty(dirProperty, bindConfig, current, directiveBinder);
|
||||
});
|
||||
}
|
||||
if (isPresent(directive.events)) {
|
||||
MapWrapper.forEach(directive.events, (action, eventName) => {
|
||||
if (isPresent(directive.hostListeners)) {
|
||||
MapWrapper.forEach(directive.hostListeners, (action, eventName) => {
|
||||
this._bindDirectiveEvent(eventName, action, current, directiveBinder);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
|
||||
import {XHR} from 'angular2/src/services/xhr';
|
||||
|
||||
import {Template} from '../../api';
|
||||
import {ViewDefinition} from '../../api';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
|
||||
/**
|
||||
|
@ -23,9 +23,9 @@ export class TemplateLoader {
|
|||
this._htmlCache = StringMapWrapper.create();
|
||||
}
|
||||
|
||||
load(template: Template):Promise {
|
||||
if (isPresent(template.inline)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.inline));
|
||||
load(template: ViewDefinition):Promise {
|
||||
if (isPresent(template.template)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.template));
|
||||
}
|
||||
var url = template.absUrl;
|
||||
if (isPresent(url)) {
|
||||
|
@ -42,6 +42,6 @@ export class TemplateLoader {
|
|||
return promise;
|
||||
}
|
||||
|
||||
throw new BaseException('Templates should have either their url or inline property set');
|
||||
throw new BaseException('View should have either the url or template property set');
|
||||
}
|
||||
}
|
||||
|
|
|
@ -4,8 +4,8 @@ import {List, ListWrapper} from 'angular2/src/facade/collection';
|
|||
import {isBlank, isPresent} from 'angular2/src/facade/lang';
|
||||
|
||||
import * as api from '../api';
|
||||
import {View} from './view/view';
|
||||
import {ProtoView} from './view/proto_view';
|
||||
import {RenderView} from './view/view';
|
||||
import {RenderProtoView} from './view/proto_view';
|
||||
import {ViewFactory} from './view/view_factory';
|
||||
import {Compiler} from './compiler/compiler';
|
||||
import {ShadowDomStrategy} from './shadow_dom/shadow_dom_strategy';
|
||||
|
@ -23,7 +23,7 @@ function _resolveProtoView(protoViewRef:DirectDomProtoViewRef) {
|
|||
return isPresent(protoViewRef) ? protoViewRef.delegate : null;
|
||||
}
|
||||
|
||||
function _wrapView(view:View) {
|
||||
function _wrapView(view:RenderView) {
|
||||
return new DirectDomViewRef(view);
|
||||
}
|
||||
|
||||
|
@ -44,18 +44,18 @@ function _collectComponentChildViewRefs(view, target = null) {
|
|||
|
||||
// public so that the compiler can use it.
|
||||
export class DirectDomProtoViewRef extends api.ProtoViewRef {
|
||||
delegate:ProtoView;
|
||||
delegate:RenderProtoView;
|
||||
|
||||
constructor(delegate:ProtoView) {
|
||||
constructor(delegate:RenderProtoView) {
|
||||
super();
|
||||
this.delegate = delegate;
|
||||
}
|
||||
}
|
||||
|
||||
export class DirectDomViewRef extends api.ViewRef {
|
||||
delegate:View;
|
||||
delegate:RenderView;
|
||||
|
||||
constructor(delegate:View) {
|
||||
constructor(delegate:RenderView) {
|
||||
super();
|
||||
this.delegate = delegate;
|
||||
}
|
||||
|
@ -75,7 +75,7 @@ export class DirectDomRenderer extends api.Renderer {
|
|||
this._shadowDomStrategy = shadowDomStrategy;
|
||||
}
|
||||
|
||||
compile(template:api.Template):Promise<api.ProtoView> {
|
||||
compile(template:api.ViewDefinition):Promise<api.ProtoViewDto> {
|
||||
// Note: compiler already uses a DirectDomProtoViewRef, so we don't
|
||||
// need to do anything here
|
||||
return this._compiler.compile(template);
|
||||
|
@ -87,7 +87,7 @@ export class DirectDomRenderer extends api.Renderer {
|
|||
);
|
||||
}
|
||||
|
||||
createRootProtoView(selectorOrElement, componentId):Promise<api.ProtoView> {
|
||||
createRootProtoView(selectorOrElement, componentId):Promise<api.ProtoViewDto> {
|
||||
var element = selectorOrElement; // TODO: select the element if it is not a real element...
|
||||
var rootProtoViewBuilder = new ProtoViewBuilder(element);
|
||||
rootProtoViewBuilder.setIsRootView(true);
|
||||
|
|
|
@ -33,12 +33,12 @@ export class EmulatedUnscopedShadowDomStrategy extends ShadowDomStrategy {
|
|||
return false;
|
||||
}
|
||||
|
||||
attachTemplate(el, view:viewModule.View) {
|
||||
attachTemplate(el, view:viewModule.RenderView) {
|
||||
DOM.clearNodes(el);
|
||||
moveViewNodesIntoParent(el, view);
|
||||
}
|
||||
|
||||
constructLightDom(lightDomView:viewModule.View, shadowDomView:viewModule.View, el): LightDom {
|
||||
constructLightDom(lightDomView:viewModule.RenderView, shadowDomView:viewModule.RenderView, el): LightDom {
|
||||
return new LightDom(lightDomView, shadowDomView, el);
|
||||
}
|
||||
|
||||
|
@ -51,4 +51,4 @@ export class EmulatedUnscopedShadowDomStrategy extends ShadowDomStrategy {
|
|||
insertSharedStyleText(cssText, this.styleHost, styleEl);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -23,14 +23,14 @@ class _Root {
|
|||
// once interfaces are supported
|
||||
export class LightDom {
|
||||
// The light DOM of the element is enclosed inside the lightDomView
|
||||
lightDomView:viewModule.View;
|
||||
lightDomView:viewModule.RenderView;
|
||||
// The shadow DOM
|
||||
shadowDomView:viewModule.View;
|
||||
shadowDomView:viewModule.RenderView;
|
||||
// The nodes of the light DOM
|
||||
nodes:List;
|
||||
roots:List<_Root>;
|
||||
|
||||
constructor(lightDomView:viewModule.View, shadowDomView:viewModule.View, element) {
|
||||
constructor(lightDomView:viewModule.RenderView, shadowDomView:viewModule.RenderView, element) {
|
||||
this.lightDomView = lightDomView;
|
||||
this.shadowDomView = shadowDomView;
|
||||
this.nodes = DOM.childNodesAsList(element);
|
||||
|
@ -50,7 +50,7 @@ export class LightDom {
|
|||
}
|
||||
|
||||
// Collects the Content directives from the view and all its child views
|
||||
_collectAllContentTags(view: viewModule.View, acc:List<Content>):List<Content> {
|
||||
_collectAllContentTags(view: viewModule.RenderView, acc:List<Content>):List<Content> {
|
||||
var contentTags = view.contentTags;
|
||||
var vcs = view.viewContainers;
|
||||
for (var i=0; i<vcs.length; i++) {
|
||||
|
|
|
@ -22,7 +22,7 @@ export class NativeShadowDomStrategy extends ShadowDomStrategy {
|
|||
this.styleUrlResolver = styleUrlResolver;
|
||||
}
|
||||
|
||||
attachTemplate(el, view:viewModule.View){
|
||||
attachTemplate(el, view:viewModule.RenderView){
|
||||
moveViewNodesIntoParent(DOM.createShadowRoot(el), view);
|
||||
}
|
||||
|
||||
|
|
|
@ -7,15 +7,15 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {CompileStep} from '../compiler/compile_step';
|
||||
import {CompileElement} from '../compiler/compile_element';
|
||||
import {CompileControl} from '../compiler/compile_control';
|
||||
import {Template} from '../../api';
|
||||
import {ViewDefinition} from '../../api';
|
||||
import {ShadowDomStrategy} from './shadow_dom_strategy';
|
||||
|
||||
export class ShadowDomCompileStep extends CompileStep {
|
||||
_shadowDomStrategy: ShadowDomStrategy;
|
||||
_template: Template;
|
||||
_template: ViewDefinition;
|
||||
_subTaskPromises: List<Promise>;
|
||||
|
||||
constructor(shadowDomStrategy: ShadowDomStrategy, template: Template, subTaskPromises:List<Promise>) {
|
||||
constructor(shadowDomStrategy: ShadowDomStrategy, template: ViewDefinition, subTaskPromises:List<Promise>) {
|
||||
super();
|
||||
this._shadowDomStrategy = shadowDomStrategy;
|
||||
this._template = template;
|
||||
|
|
|
@ -9,9 +9,9 @@ export class ShadowDomStrategy {
|
|||
return true;
|
||||
}
|
||||
|
||||
attachTemplate(el, view:viewModule.View) {}
|
||||
attachTemplate(el, view:viewModule.RenderView) {}
|
||||
|
||||
constructLightDom(lightDomView:viewModule.View, shadowDomView:viewModule.View, el): LightDom {
|
||||
constructLightDom(lightDomView:viewModule.RenderView, shadowDomView:viewModule.RenderView, el): LightDom {
|
||||
return null;
|
||||
}
|
||||
|
||||
|
|
|
@ -6,7 +6,7 @@ import * as protoViewModule from './proto_view';
|
|||
export class ElementBinder {
|
||||
contentTagSelector: string;
|
||||
textNodeIndices: List<number>;
|
||||
nestedProtoView: protoViewModule.ProtoView;
|
||||
nestedProtoView: protoViewModule.RenderProtoView;
|
||||
eventLocals: AST;
|
||||
eventNames: List<string>;
|
||||
componentId: string;
|
||||
|
|
|
@ -6,7 +6,7 @@ import {List, Map, ListWrapper, MapWrapper} from 'angular2/src/facade/collection
|
|||
import {ElementBinder} from './element_binder';
|
||||
import {NG_BINDING_CLASS} from '../util';
|
||||
|
||||
export class ProtoView {
|
||||
export class RenderProtoView {
|
||||
element;
|
||||
elementBinders:List<ElementBinder>;
|
||||
isTemplateElement:boolean;
|
||||
|
@ -25,7 +25,7 @@ export class ProtoView {
|
|||
this.rootBindingOffset = (isPresent(this.element) && DOM.hasClass(this.element, NG_BINDING_CLASS)) ? 1 : 0;
|
||||
}
|
||||
|
||||
mergeChildComponentProtoViews(componentProtoViews:List<ProtoView>) {
|
||||
mergeChildComponentProtoViews(componentProtoViews:List<RenderProtoView>) {
|
||||
var componentProtoViewIndex = 0;
|
||||
for (var i=0; i<this.elementBinders.length; i++) {
|
||||
var eb = this.elementBinders[i];
|
||||
|
|
|
@ -7,7 +7,7 @@ import {
|
|||
} from 'angular2/change_detection';
|
||||
import {SetterFn} from 'angular2/src/reflection/types';
|
||||
|
||||
import {ProtoView} from './proto_view';
|
||||
import {RenderProtoView} from './proto_view';
|
||||
import {ElementBinder} from './element_binder';
|
||||
import {setterFactory} from './property_setter_factory';
|
||||
|
||||
|
@ -39,7 +39,7 @@ export class ProtoViewBuilder {
|
|||
|
||||
bindVariable(name, value) {
|
||||
// Store the variable map from value to variable, reflecting how it will be used later by
|
||||
// View. When a local is set to the view, a lookup for the variable name will take place keyed
|
||||
// RenderView. When a local is set to the view, a lookup for the variable name will take place keyed
|
||||
// by the "value", or exported identifier. For example, ng-repeat sets a view local of "index".
|
||||
// When this occurs, a lookup keyed by "index" must occur to find if there is a var referencing
|
||||
// it.
|
||||
|
@ -50,7 +50,7 @@ export class ProtoViewBuilder {
|
|||
this.isRootView = value;
|
||||
}
|
||||
|
||||
build():api.ProtoView {
|
||||
build():api.ProtoViewDto {
|
||||
var renderElementBinders = [];
|
||||
|
||||
var apiElementBinders = [];
|
||||
|
@ -91,8 +91,8 @@ export class ProtoViewBuilder {
|
|||
propertySetters: propertySetters
|
||||
}));
|
||||
});
|
||||
return new api.ProtoView({
|
||||
render: new directDomRenderer.DirectDomProtoViewRef(new ProtoView({
|
||||
return new api.ProtoViewDto({
|
||||
render: new directDomRenderer.DirectDomProtoViewRef(new RenderProtoView({
|
||||
element: this.rootElement,
|
||||
elementBinders: renderElementBinders,
|
||||
isRootView: this.isRootView
|
||||
|
@ -183,7 +183,7 @@ export class ElementBinderBuilder {
|
|||
this.nestedProtoView.bindVariable(name, value);
|
||||
} else {
|
||||
// Store the variable map from value to variable, reflecting how it will be used later by
|
||||
// View. When a local is set to the view, a lookup for the variable name will take place keyed
|
||||
// RenderView. When a local is set to the view, a lookup for the variable name will take place keyed
|
||||
// by the "value", or exported identifier. For example, ng-repeat sets a view local of "index".
|
||||
// When this occurs, a lookup keyed by "index" must occur to find if there is a var referencing
|
||||
// it.
|
||||
|
@ -283,4 +283,4 @@ export class EventLocalsAstSplitter extends AstTransformer {
|
|||
buildEventNames() {
|
||||
return this.eventNames;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@ import {ListWrapper, MapWrapper, Map, StringMapWrapper, List} from 'angular2/src
|
|||
import {int, isPresent, isBlank, BaseException} from 'angular2/src/facade/lang';
|
||||
|
||||
import {ViewContainer} from './view_container';
|
||||
import {ProtoView} from './proto_view';
|
||||
import {RenderProtoView} from './proto_view';
|
||||
import {LightDom} from '../shadow_dom/light_dom';
|
||||
import {Content} from '../shadow_dom/content_tag';
|
||||
|
||||
|
@ -16,7 +16,7 @@ const NG_BINDING_CLASS = 'ng-binding';
|
|||
/**
|
||||
* Const of making objects: http://jsperf.com/instantiate-size-of-object
|
||||
*/
|
||||
export class View {
|
||||
export class RenderView {
|
||||
boundElements:List;
|
||||
boundTextNodes:List;
|
||||
/// When the view is part of render tree, the DocumentFragment is empty, which is why we need
|
||||
|
@ -24,16 +24,16 @@ export class View {
|
|||
rootNodes:List;
|
||||
// TODO(tbosch): move componentChildViews, viewContainers, contentTags, lightDoms into
|
||||
// a single array with records inside
|
||||
componentChildViews: List<View>;
|
||||
componentChildViews: List<RenderView>;
|
||||
viewContainers: List<ViewContainer>;
|
||||
contentTags: List<Content>;
|
||||
lightDoms: List<LightDom>;
|
||||
proto: ProtoView;
|
||||
proto: RenderProtoView;
|
||||
_hydrated: boolean;
|
||||
_eventDispatcher: any/*EventDispatcher*/;
|
||||
|
||||
constructor(
|
||||
proto:ProtoView, rootNodes:List,
|
||||
proto:RenderProtoView, rootNodes:List,
|
||||
boundTextNodes: List, boundElements:List, viewContainers:List, contentTags:List) {
|
||||
this.proto = proto;
|
||||
this.rootNodes = rootNodes;
|
||||
|
@ -61,7 +61,7 @@ export class View {
|
|||
}
|
||||
|
||||
setComponentView(strategy: ShadowDomStrategy,
|
||||
elementIndex:number, childView:View) {
|
||||
elementIndex:number, childView:RenderView) {
|
||||
var element = this.boundElements[elementIndex];
|
||||
var lightDom = strategy.constructLightDom(this, childView, element);
|
||||
strategy.attachTemplate(element, childView);
|
||||
|
|
|
@ -9,7 +9,7 @@ import * as vfModule from './view_factory';
|
|||
export class ViewContainer {
|
||||
_viewFactory: vfModule.ViewFactory;
|
||||
templateElement;
|
||||
_views: List<viewModule.View>;
|
||||
_views: List<viewModule.RenderView>;
|
||||
_lightDom: ldModule.LightDom;
|
||||
_hostLightDom: ldModule.LightDom;
|
||||
_hydrated: boolean;
|
||||
|
@ -53,7 +53,7 @@ export class ViewContainer {
|
|||
this._hydrated = false;
|
||||
}
|
||||
|
||||
get(index: number): viewModule.View {
|
||||
get(index: number): viewModule.RenderView {
|
||||
return this._views[index];
|
||||
}
|
||||
|
||||
|
@ -71,7 +71,7 @@ export class ViewContainer {
|
|||
'Cannot change dehydrated ViewContainer');
|
||||
}
|
||||
|
||||
insert(view, atIndex=-1): viewModule.View {
|
||||
insert(view, atIndex=-1): viewModule.RenderView {
|
||||
if (!view.hydrated()) {
|
||||
view.hydrate(this._hostLightDom);
|
||||
}
|
||||
|
|
|
@ -19,7 +19,7 @@ export const VIEW_POOL_CAPACITY = 'render.ViewFactory.viewPoolCapacity';
|
|||
@Injectable()
|
||||
export class ViewFactory {
|
||||
_poolCapacity:number;
|
||||
_pooledViews:List<viewModule.View>;
|
||||
_pooledViews:List<viewModule.RenderView>;
|
||||
_eventManager:EventManager;
|
||||
_shadowDomStrategy:ShadowDomStrategy;
|
||||
|
||||
|
@ -30,7 +30,7 @@ export class ViewFactory {
|
|||
this._shadowDomStrategy = shadowDomStrategy;
|
||||
}
|
||||
|
||||
getView(protoView:pvModule.ProtoView):viewModule.View {
|
||||
getView(protoView:pvModule.RenderProtoView):viewModule.RenderView {
|
||||
// TODO(tbosch): benchmark this scanning of views and maybe
|
||||
// replace it with a fancy LRU Map/List combination...
|
||||
var view;
|
||||
|
@ -46,7 +46,7 @@ export class ViewFactory {
|
|||
return view;
|
||||
}
|
||||
|
||||
returnView(view:viewModule.View) {
|
||||
returnView(view:viewModule.RenderView) {
|
||||
if (view.hydrated()) {
|
||||
view.dehydrate();
|
||||
}
|
||||
|
@ -56,7 +56,7 @@ export class ViewFactory {
|
|||
}
|
||||
}
|
||||
|
||||
_createView(protoView:pvModule.ProtoView): viewModule.View {
|
||||
_createView(protoView:pvModule.RenderProtoView): viewModule.RenderView {
|
||||
var rootElementClone = protoView.isRootView ? protoView.element : DOM.importIntoDoc(protoView.element);
|
||||
var elementsWithBindingsDynamic;
|
||||
if (protoView.isTemplateElement) {
|
||||
|
@ -73,7 +73,7 @@ export class ViewFactory {
|
|||
var viewRootNodes;
|
||||
if (protoView.isTemplateElement) {
|
||||
var childNode = DOM.firstChild(DOM.content(rootElementClone));
|
||||
viewRootNodes = []; // TODO(perf): Should be fixed size, since we could pre-compute in in pvModule.ProtoView
|
||||
viewRootNodes = []; // TODO(perf): Should be fixed size, since we could pre-compute in in pvModule.RenderProtoView
|
||||
// Note: An explicit loop is the fastest way to convert a DOM array into a JS array!
|
||||
while(childNode != null) {
|
||||
ListWrapper.push(viewRootNodes, childNode);
|
||||
|
@ -121,7 +121,7 @@ export class ViewFactory {
|
|||
contentTags[binderIdx] = contentTag;
|
||||
}
|
||||
|
||||
var view = new viewModule.View(
|
||||
var view = new viewModule.RenderView(
|
||||
protoView, viewRootNodes,
|
||||
boundTextNodes, boundElements, viewContainers, contentTags
|
||||
);
|
||||
|
@ -156,4 +156,4 @@ export class ViewFactory {
|
|||
view.dispatchEvent(elementIndex, eventName, event);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,11 +5,11 @@ import {Promise} from 'angular2/src/facade/async';
|
|||
import {isBlank} from 'angular2/src/facade/lang';
|
||||
import {List} from 'angular2/src/facade/collection';
|
||||
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {TemplateResolver} from 'angular2/src/core/compiler/template_resolver';
|
||||
import {Compiler} from 'angular2/src/core/compiler/compiler';
|
||||
import {View} from 'angular2/src/core/compiler/view';
|
||||
import {AppView} from 'angular2/src/core/compiler/view';
|
||||
import {ViewFactory} from 'angular2/src/core/compiler/view_factory';
|
||||
|
||||
import {DirectiveBinding} from 'angular2/src/core/compiler/element_injector';
|
||||
|
@ -27,20 +27,20 @@ export class TestBed {
|
|||
}
|
||||
|
||||
/**
|
||||
* Overrides the [Template] of a [Component].
|
||||
* Overrides the [View] of a [Component].
|
||||
*
|
||||
* @see setInlineTemplate() to only override the html
|
||||
*
|
||||
* @param {Type} component
|
||||
* @param {Template} template
|
||||
* @param {ViewDefinition} template
|
||||
*/
|
||||
overrideTemplate(component: Type, template: Template): void {
|
||||
this._injector.get(TemplateResolver).setTemplate(component, template);
|
||||
overrideView(component: Type, template: View): void {
|
||||
this._injector.get(TemplateResolver).setView(component, template);
|
||||
}
|
||||
|
||||
/**
|
||||
* Overrides only the html of a [Component].
|
||||
* All the other propoerties of the component's [Template] are preserved.
|
||||
* All the other propoerties of the component's [View] are preserved.
|
||||
*
|
||||
* @param {Type} component
|
||||
* @param {string} html
|
||||
|
@ -50,7 +50,7 @@ export class TestBed {
|
|||
}
|
||||
|
||||
/**
|
||||
* Overrides the directives from the component [Template].
|
||||
* Overrides the directives from the component [View].
|
||||
*
|
||||
* @param {Type} component
|
||||
* @param {Type} from
|
||||
|
@ -61,7 +61,7 @@ export class TestBed {
|
|||
}
|
||||
|
||||
/**
|
||||
* Creates a [View] for the given component.
|
||||
* Creates a [AppView] for the given component.
|
||||
*
|
||||
* Only either a component or a context needs to be specified but both can be provided for
|
||||
* advanced use cases (ie subclassing the context).
|
||||
|
@ -72,7 +72,7 @@ export class TestBed {
|
|||
* @return {Promise<ViewProxy>}
|
||||
*/
|
||||
createView(component: Type,
|
||||
{context = null, html = null}: {context:any, html: string} = {}): Promise<View> {
|
||||
{context = null, html = null}: {context:any, html: string} = {}): Promise<AppView> {
|
||||
|
||||
if (isBlank(component) && isBlank(context)) {
|
||||
throw new BaseException('You must specified at least a component or a context');
|
||||
|
@ -104,12 +104,12 @@ export class TestBed {
|
|||
}
|
||||
|
||||
/**
|
||||
* Proxy to [View] return by [TestBed.createView] which offers a high level API for tests.
|
||||
* Proxy to [AppView] return by [TestBed.createView] which offers a high level API for tests.
|
||||
*/
|
||||
export class ViewProxy {
|
||||
_view: View;
|
||||
_view: AppView;
|
||||
|
||||
constructor(view: View) {
|
||||
constructor(view: AppView) {
|
||||
this._view = view;
|
||||
}
|
||||
|
||||
|
@ -130,11 +130,11 @@ export class ViewProxy {
|
|||
}
|
||||
|
||||
/**
|
||||
* @returns {View} return the underlying [View].
|
||||
* @returns {AppView} return the underlying [AppView].
|
||||
*
|
||||
* Prefer using the other methods which hide implementation details.
|
||||
*/
|
||||
get rawView(): View {
|
||||
get rawView(): AppView {
|
||||
return this._view;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -17,7 +17,7 @@ class ExtractSettersVisitor extends Object with RecursiveAstVisitor<Object> {
|
|||
bindMappings[stringLiteralToString(entry.key)] =
|
||||
stringLiteralToString(entry.value);
|
||||
} else {
|
||||
logger.error('`bind` currently only supports string literals '
|
||||
logger.error('`properties` currently only supports string literals '
|
||||
'(${entry})');
|
||||
}
|
||||
});
|
||||
|
@ -25,12 +25,12 @@ class ExtractSettersVisitor extends Object with RecursiveAstVisitor<Object> {
|
|||
|
||||
@override
|
||||
Object visitNamedExpression(NamedExpression node) {
|
||||
if ('${node.name.label}' == 'bind') {
|
||||
if ('${node.name.label}' == 'properties') {
|
||||
// TODO(kegluneq): Remove this restriction.
|
||||
if (node.expression is MapLiteral) {
|
||||
_extractFromMapLiteral(node.expression);
|
||||
} else {
|
||||
logger.error('`bind` currently only supports map literals');
|
||||
logger.error('`properties` currently only supports map literals');
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
|
|
@ -200,6 +200,6 @@ class _Tester {
|
|||
return metaName == 'Component' ||
|
||||
metaName == 'Decorator' ||
|
||||
metaName == 'Injectable' ||
|
||||
metaName == 'Template';
|
||||
metaName == 'View';
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,7 +14,7 @@ import 'rewriter.dart';
|
|||
/// reflector.
|
||||
///
|
||||
/// This will also create .ng_deps.dart files for classes annotated
|
||||
/// with @Component, @Template, @Decorator, etc.
|
||||
/// with @Component, @View, @Decorator, etc.
|
||||
///
|
||||
/// This transformer is the first phase in a two-phase transform. It should
|
||||
/// be followed by [DirectiveLinker].
|
||||
|
|
|
@ -17,12 +17,12 @@ class Context {
|
|||
final Map<LibraryElement, String> _libraryPrefixes = {};
|
||||
|
||||
/// Whether to generate constructor stubs for classes annotated
|
||||
/// with [Component], [Decorator], [Template], and [Inject] (and subtypes).
|
||||
/// with [Component], [Decorator], [View], and [Inject] (and subtypes).
|
||||
bool generateCtorStubs = true;
|
||||
|
||||
/// Whether to generate setter stubs for classes annotated with
|
||||
/// [Directive] subtypes. These setters depend on the value passed to the
|
||||
/// annotation's `bind` value.
|
||||
/// annotation's `properties` value.
|
||||
bool generateSetterStubs = true;
|
||||
|
||||
DirectiveRegistry _directiveRegistry;
|
||||
|
@ -499,7 +499,7 @@ class _BindTransformVisitor extends Object
|
|||
if (entry.key is SimpleStringLiteral) {
|
||||
_visitNode(entry.key);
|
||||
} else {
|
||||
logger.error('`bind` currently only supports string literals');
|
||||
logger.error('`properties` currently only supports string literals');
|
||||
}
|
||||
});
|
||||
return null;
|
||||
|
|
|
@ -57,7 +57,7 @@ class Angular2Types {
|
|||
static final _applicationLibAssetId =
|
||||
new AssetId('angular2', 'lib/src/core/application.dart');
|
||||
static final _templateLibAssetId =
|
||||
new AssetId('angular2', 'lib/src/core/annotations/template.dart');
|
||||
new AssetId('angular2', 'lib/src/core/annotations/view.dart');
|
||||
static final _reflectionCapabilitiesLibAssetId = new AssetId(
|
||||
'angular2', 'lib/src/reflection/reflection_capabilities.dart');
|
||||
|
||||
|
@ -85,7 +85,7 @@ class Angular2Types {
|
|||
|
||||
LibraryElement get templateLib => _resolver.getLibrary(_templateLibAssetId);
|
||||
|
||||
ClassElement get templateAnnotation => _getTypeSafe(templateLib, 'Template');
|
||||
ClassElement get templateAnnotation => _getTypeSafe(templateLib, 'View');
|
||||
|
||||
LibraryElement get reflectionCapabilitiesLib =>
|
||||
_resolver.getLibrary(_reflectionCapabilitiesLibAssetId);
|
||||
|
|
|
@ -22,7 +22,7 @@ import 'package:code_transformers/assets.dart';
|
|||
import 'recording_reflection_capabilities.dart';
|
||||
|
||||
/// Reads the `.ng_deps.dart` file represented by `entryPoint` and parses any
|
||||
/// Angular 2 `Template` annotations it declares to generate `getter`s,
|
||||
/// Angular 2 `View` annotations it declares to generate `getter`s,
|
||||
/// `setter`s, and `method`s that would otherwise be reflectively accessed.
|
||||
///
|
||||
/// This method assumes a [DomAdapter] has been registered.
|
||||
|
@ -80,7 +80,7 @@ Iterable<String> _generateMethods(String typeName, List<String> methodNames) {
|
|||
''');
|
||||
}
|
||||
|
||||
/// Extracts `inline` and `url` values from `Template` annotations, reads
|
||||
/// Extracts `template` and `url` values from `View` annotations, reads
|
||||
/// template code if necessary, and determines what values will be
|
||||
/// reflectively accessed from that template.
|
||||
class _TemplateExtractor {
|
||||
|
@ -131,7 +131,7 @@ class _TemplateExtractor {
|
|||
return toReturn;
|
||||
}
|
||||
|
||||
// TODO(kegluneq): Rewrite these to `inline` where possible.
|
||||
// TODO(kegluneq): Rewrite these to `template` where possible.
|
||||
// See [https://github.com/angular/angular/issues/1035].
|
||||
Future<String> _readUrlTemplate(String url) async {
|
||||
var assetId = uriToAssetId(_entryPoint, url, logger, null);
|
||||
|
@ -165,7 +165,7 @@ class _TemplateExtractVisitor extends Object with RecursiveAstVisitor<Object> {
|
|||
return null;
|
||||
}
|
||||
var keyString = '${node.name.label}';
|
||||
if (keyString == 'inline' || keyString == 'url') {
|
||||
if (keyString == 'template' || keyString == 'templateUrl') {
|
||||
if (node.expression is! SimpleStringLiteral) {
|
||||
logger.error(
|
||||
'Angular 2 currently only supports string literals in directives.'
|
||||
|
@ -173,7 +173,7 @@ class _TemplateExtractVisitor extends Object with RecursiveAstVisitor<Object> {
|
|||
return null;
|
||||
}
|
||||
var valueString = stringLiteralToString(node.expression);
|
||||
if (keyString == 'url') {
|
||||
if (keyString == 'templateUrl') {
|
||||
urlValues.add(valueString);
|
||||
} else {
|
||||
inlineValues.add(valueString);
|
||||
|
|
|
@ -17,12 +17,12 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {ListWrapper} from 'angular2/src/facade/collection';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {bind, Inject} from 'angular2/di';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {LifeCycle} from 'angular2/src/core/life_cycle/life_cycle';
|
||||
import {Testability, TestabilityRegistry} from 'angular2/src/core/testability/testability';
|
||||
|
||||
@Component({selector: 'hello-app'})
|
||||
@Template({inline: '{{greeting}} world!'})
|
||||
@View({template: '{{greeting}} world!'})
|
||||
class HelloRootCmp {
|
||||
greeting:string;
|
||||
constructor() {
|
||||
|
@ -31,13 +31,13 @@ class HelloRootCmp {
|
|||
}
|
||||
|
||||
@Component({selector: 'hello-app'})
|
||||
@Template({inline: 'before: <content></content> after: done'})
|
||||
@View({template: 'before: <content></content> after: done'})
|
||||
class HelloRootCmpContent {
|
||||
constructor() { }
|
||||
}
|
||||
|
||||
@Component({selector: 'hello-app-2'})
|
||||
@Template({inline: '{{greeting}} world, again!'})
|
||||
@View({template: '{{greeting}} world, again!'})
|
||||
class HelloRootCmp2 {
|
||||
greeting:string;
|
||||
constructor() {
|
||||
|
@ -46,7 +46,7 @@ class HelloRootCmp2 {
|
|||
}
|
||||
|
||||
@Component({selector: 'hello-app'})
|
||||
@Template({inline: ''})
|
||||
@View({template: ''})
|
||||
class HelloRootCmp3 {
|
||||
appBinding;
|
||||
|
||||
|
@ -56,7 +56,7 @@ class HelloRootCmp3 {
|
|||
}
|
||||
|
||||
@Component({selector: 'hello-app'})
|
||||
@Template({inline: ''})
|
||||
@View({template: ''})
|
||||
class HelloRootCmp4 {
|
||||
lc;
|
||||
|
||||
|
@ -87,7 +87,7 @@ export function main() {
|
|||
});
|
||||
|
||||
describe('bootstrap factory method', () => {
|
||||
it('should throw if no Template found', inject([AsyncTestCompleter], (async) => {
|
||||
it('should throw if no View found', inject([AsyncTestCompleter], (async) => {
|
||||
var injectorPromise = bootstrap(HelloRootMissingTemplate, testBindings, (e,t) => {throw e;});
|
||||
PromiseWrapper.then(injectorPromise, null, (reason) => {
|
||||
expect(reason.message).toContain('No template found for HelloRootMissingTemplate');
|
||||
|
|
|
@ -17,12 +17,12 @@ import {Type, isBlank, stringify, isPresent} from 'angular2/src/facade/lang';
|
|||
import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
|
||||
|
||||
import {Compiler, CompilerCache} from 'angular2/src/core/compiler/compiler';
|
||||
import {ProtoView} from 'angular2/src/core/compiler/view';
|
||||
import {AppProtoView} from 'angular2/src/core/compiler/view';
|
||||
import {ElementBinder} from 'angular2/src/core/compiler/element_binder';
|
||||
import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
|
||||
import {Component, DynamicComponent, Viewport, Decorator} from 'angular2/src/core/annotations/annotations';
|
||||
import {PropertySetter, Attribute} from 'angular2/src/core/annotations/di';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {DirectiveBinding} from 'angular2/src/core/compiler/element_injector';
|
||||
import {TemplateResolver} from 'angular2/src/core/compiler/template_resolver';
|
||||
import {ComponentUrlMapper, RuntimeComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper';
|
||||
|
@ -41,7 +41,7 @@ export function main() {
|
|||
cmpUrlMapper = new RuntimeComponentUrlMapper();
|
||||
});
|
||||
|
||||
function createCompiler(renderCompileResults:List, protoViewFactoryResults:List<ProtoView>) {
|
||||
function createCompiler(renderCompileResults:List, protoViewFactoryResults:List<AppProtoView>) {
|
||||
var urlResolver = new FakeUrlResolver();
|
||||
renderer = new FakeRenderer(renderCompileResults);
|
||||
protoViewFactory = new FakeProtoViewFactory(protoViewFactoryResults)
|
||||
|
@ -58,8 +58,8 @@ export function main() {
|
|||
|
||||
describe('serialize template', () => {
|
||||
|
||||
function captureTemplate(template:Template):Promise<renderApi.Template> {
|
||||
tplResolver.setTemplate(MainComponent, template);
|
||||
function captureTemplate(template:View):Promise<renderApi.ViewDefinition> {
|
||||
tplResolver.setView(MainComponent, template);
|
||||
var compiler = createCompiler([createRenderProtoView()], [createProtoView()]);
|
||||
return compiler.compile(MainComponent).then( (protoView) => {
|
||||
expect(renderer.requests.length).toBe(1);
|
||||
|
@ -68,29 +68,29 @@ export function main() {
|
|||
}
|
||||
|
||||
function captureDirective(directive):Promise<renderApi.DirectiveMetadata> {
|
||||
return captureTemplate(new Template({inline: '<div></div>', directives: [directive]})).then( (renderTpl) => {
|
||||
return captureTemplate(new View({template: '<div></div>', directives: [directive]})).then( (renderTpl) => {
|
||||
expect(renderTpl.directives.length).toBe(1);
|
||||
return renderTpl.directives[0];
|
||||
});
|
||||
}
|
||||
|
||||
it('should fill the componentId', inject([AsyncTestCompleter], (async) => {
|
||||
captureTemplate(new Template({inline: '<div></div>'})).then( (renderTpl) => {
|
||||
captureTemplate(new View({template: '<div></div>'})).then( (renderTpl) => {
|
||||
expect(renderTpl.componentId).toEqual(stringify(MainComponent));
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should fill inline', inject([AsyncTestCompleter], (async) => {
|
||||
captureTemplate(new Template({inline: '<div></div>'})).then( (renderTpl) => {
|
||||
expect(renderTpl.inline).toEqual('<div></div>');
|
||||
it('should fill inline template', inject([AsyncTestCompleter], (async) => {
|
||||
captureTemplate(new View({template: '<div></div>'})).then( (renderTpl) => {
|
||||
expect(renderTpl.template).toEqual('<div></div>');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should fill absUrl given inline templates', inject([AsyncTestCompleter], (async) => {
|
||||
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
|
||||
captureTemplate(new Template({inline: '<div></div>'})).then( (renderTpl) => {
|
||||
captureTemplate(new View({template: '<div></div>'})).then( (renderTpl) => {
|
||||
expect(renderTpl.absUrl).toEqual('http://www.app.com/mainComponent');
|
||||
async.done();
|
||||
});
|
||||
|
@ -98,7 +98,7 @@ export function main() {
|
|||
|
||||
it('should fill absUrl given url template', inject([AsyncTestCompleter], (async) => {
|
||||
cmpUrlMapper.setComponentUrl(MainComponent, '/mainComponent');
|
||||
captureTemplate(new Template({url: '/someTemplate'})).then( (renderTpl) => {
|
||||
captureTemplate(new View({templateUrl: '/someTemplate'})).then( (renderTpl) => {
|
||||
expect(renderTpl.absUrl).toEqual('http://www.app.com/mainComponent/someTemplate');
|
||||
async.done();
|
||||
});
|
||||
|
@ -167,9 +167,9 @@ export function main() {
|
|||
});
|
||||
}));
|
||||
|
||||
it('should set directive.events', inject([AsyncTestCompleter], (async) => {
|
||||
it('should set directive.hostListeners', inject([AsyncTestCompleter], (async) => {
|
||||
captureDirective(DirectiveWithEvents).then( (renderDir) => {
|
||||
expect(renderDir.events).toEqual(MapWrapper.createFromStringMap({
|
||||
expect(renderDir.hostListeners).toEqual(MapWrapper.createFromStringMap({
|
||||
'someEvent': 'someAction'
|
||||
}));
|
||||
async.done();
|
||||
|
@ -178,7 +178,7 @@ export function main() {
|
|||
|
||||
it('should set directive.bind', inject([AsyncTestCompleter], (async) => {
|
||||
captureDirective(DirectiveWithBind).then( (renderDir) => {
|
||||
expect(renderDir.bind).toEqual(MapWrapper.createFromStringMap({
|
||||
expect(renderDir.properties).toEqual(MapWrapper.createFromStringMap({
|
||||
'a': 'b'
|
||||
}));
|
||||
async.done();
|
||||
|
@ -203,7 +203,7 @@ export function main() {
|
|||
describe('call ProtoViewFactory', () => {
|
||||
|
||||
it('should pass the render protoView', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var renderProtoView = createRenderProtoView();
|
||||
var expectedProtoView = createProtoView();
|
||||
var compiler = createCompiler([renderProtoView], [expectedProtoView]);
|
||||
|
@ -215,7 +215,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should pass the component binding', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var compiler = createCompiler([createRenderProtoView()], [createProtoView()]);
|
||||
compiler.compile(MainComponent).then( (protoView) => {
|
||||
var request = protoViewFactory.requests[0];
|
||||
|
@ -225,9 +225,9 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should pass the directive bindings', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent,
|
||||
new Template({
|
||||
inline: '<div></div>',
|
||||
tplResolver.setView(MainComponent,
|
||||
new View({
|
||||
template: '<div></div>',
|
||||
directives: [SomeDecoratorDirective]
|
||||
})
|
||||
);
|
||||
|
@ -241,7 +241,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should use the protoView of the ProtoViewFactory', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var renderProtoView = createRenderProtoView();
|
||||
var expectedProtoView = createProtoView();
|
||||
var compiler = createCompiler([renderProtoView], [expectedProtoView]);
|
||||
|
@ -254,8 +254,8 @@ export function main() {
|
|||
});
|
||||
|
||||
it('should load nested components', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setTemplate(NestedComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
tplResolver.setView(NestedComponent, new View({template: '<div></div>'}));
|
||||
var mainProtoView = createProtoView([
|
||||
createComponentElementBinder(reader, NestedComponent)
|
||||
]);
|
||||
|
@ -278,8 +278,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should load nested components in viewport', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setTemplate(NestedComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
tplResolver.setView(NestedComponent, new View({template: '<div></div>'}));
|
||||
var mainProtoView = createProtoView([
|
||||
createViewportElementBinder(null)
|
||||
]);
|
||||
|
@ -314,7 +314,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should cache compiled components', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var renderProtoView = createRenderProtoView();
|
||||
var expectedProtoView = createProtoView();
|
||||
var compiler = createCompiler([renderProtoView], [expectedProtoView]);
|
||||
|
@ -328,7 +328,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should re-use components being compiled', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var renderProtoViewCompleter = PromiseWrapper.completer();
|
||||
var expectedProtoView = createProtoView();
|
||||
var compiler = createCompiler([renderProtoViewCompleter.promise], [expectedProtoView]);
|
||||
|
@ -344,7 +344,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should allow recursive components', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var mainProtoView = createProtoView([
|
||||
createComponentElementBinder(reader, MainComponent)
|
||||
]);
|
||||
|
@ -362,7 +362,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should create root proto views', inject([AsyncTestCompleter], (async) => {
|
||||
tplResolver.setTemplate(MainComponent, new Template({inline: '<div></div>'}));
|
||||
tplResolver.setView(MainComponent, new View({template: '<div></div>'}));
|
||||
var rootProtoView = createProtoView([
|
||||
createComponentElementBinder(reader, MainComponent)
|
||||
]);
|
||||
|
@ -388,7 +388,7 @@ function createDirectiveBinding(reader, type) {
|
|||
}
|
||||
|
||||
function createProtoView(elementBinders = null) {
|
||||
var pv = new ProtoView(null, null, null);
|
||||
var pv = new AppProtoView(null, null, null);
|
||||
if (isBlank(elementBinders)) {
|
||||
elementBinders = [];
|
||||
}
|
||||
|
@ -419,7 +419,7 @@ function createRenderProtoView(elementBinders = null) {
|
|||
if (isBlank(elementBinders)) {
|
||||
elementBinders = [];
|
||||
}
|
||||
return new renderApi.ProtoView({
|
||||
return new renderApi.ProtoViewDto({
|
||||
elementBinders: elementBinders
|
||||
});
|
||||
}
|
||||
|
@ -463,12 +463,12 @@ class SomeDecoratorDirective {}
|
|||
class IgnoreChildrenDecoratorDirective {}
|
||||
|
||||
@Decorator({
|
||||
events: {'someEvent': 'someAction'}
|
||||
hostListeners: {'someEvent': 'someAction'}
|
||||
})
|
||||
class DirectiveWithEvents {}
|
||||
|
||||
@Decorator({
|
||||
bind: {'a': 'b'}
|
||||
properties: {'a': 'b'}
|
||||
})
|
||||
class DirectiveWithBind {}
|
||||
|
||||
|
@ -483,7 +483,7 @@ class DirectiveWithAttributes {
|
|||
}
|
||||
|
||||
class FakeRenderer extends renderApi.Renderer {
|
||||
requests:List<renderApi.Template>;
|
||||
requests:List<renderApi.ViewDefinition>;
|
||||
_results:List;
|
||||
|
||||
constructor(results) {
|
||||
|
@ -492,12 +492,12 @@ class FakeRenderer extends renderApi.Renderer {
|
|||
this.requests = [];
|
||||
}
|
||||
|
||||
compile(template:renderApi.Template):Promise<renderApi.ProtoView> {
|
||||
compile(template:renderApi.ViewDefinition):Promise<renderApi.ProtoViewDto> {
|
||||
ListWrapper.push(this.requests, template);
|
||||
return PromiseWrapper.resolve(ListWrapper.removeAt(this._results, 0));
|
||||
}
|
||||
|
||||
createRootProtoView(elementOrSelector, componentId):Promise<renderApi.ProtoView> {
|
||||
createRootProtoView(elementOrSelector, componentId):Promise<renderApi.ProtoViewDto> {
|
||||
return PromiseWrapper.resolve(
|
||||
createRenderProtoView([createRenderComponentElementBinder(0)])
|
||||
);
|
||||
|
@ -512,7 +512,7 @@ class FakeUrlResolver extends UrlResolver {
|
|||
resolve(baseUrl: string, url: string): string {
|
||||
if (baseUrl === null && url == './') {
|
||||
return 'http://www.app.com';
|
||||
};
|
||||
}
|
||||
|
||||
return baseUrl + url;
|
||||
}
|
||||
|
@ -527,7 +527,7 @@ class FakeTemplateResolver extends TemplateResolver {
|
|||
this._cmpTemplates = MapWrapper.create();
|
||||
}
|
||||
|
||||
resolve(component: Type): Template {
|
||||
resolve(component: Type): View {
|
||||
var template = MapWrapper.get(this._cmpTemplates, component);
|
||||
if (isBlank(template)) {
|
||||
throw 'No template';
|
||||
|
@ -535,7 +535,7 @@ class FakeTemplateResolver extends TemplateResolver {
|
|||
return template;
|
||||
}
|
||||
|
||||
setTemplate(component: Type, template: Template) {
|
||||
setView(component: Type, template: View) {
|
||||
MapWrapper.set(this._cmpTemplates, component, template);
|
||||
}
|
||||
}
|
||||
|
@ -550,8 +550,8 @@ class FakeProtoViewFactory extends ProtoViewFactory {
|
|||
this._results = results;
|
||||
}
|
||||
|
||||
createProtoView(componentBinding:DirectiveBinding, renderProtoView: renderApi.ProtoView, directives:List<DirectiveBinding>):ProtoView {
|
||||
createProtoView(componentBinding:DirectiveBinding, renderProtoView: renderApi.ProtoViewDto, directives:List<DirectiveBinding>):AppProtoView {
|
||||
ListWrapper.push(this.requests, [componentBinding, renderProtoView, directives]);
|
||||
return ListWrapper.removeAt(this._results, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@ import {Parent, Ancestor} from 'angular2/src/core/annotations/visibility';
|
|||
import {EventEmitter, PropertySetter, Attribute, Query} from 'angular2/src/core/annotations/di';
|
||||
import {onDestroy} from 'angular2/src/core/annotations/annotations';
|
||||
import {Optional, Injector, Inject, bind} from 'angular2/di';
|
||||
import {ProtoView, View} 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 {NgElement} from 'angular2/src/core/compiler/ng_element';
|
||||
import {Directive} from 'angular2/src/core/annotations/annotations';
|
||||
|
@ -20,7 +20,7 @@ class DummyDirective extends Directive {
|
|||
}
|
||||
|
||||
@proxy
|
||||
@IMPLEMENTS(View)
|
||||
@IMPLEMENTS(AppView)
|
||||
class DummyView extends SpyObject {noSuchMethod(m){super.noSuchMethod(m)}}
|
||||
|
||||
|
||||
|
@ -180,7 +180,7 @@ class B_Needs_A {
|
|||
|
||||
class NeedsView {
|
||||
view:any;
|
||||
constructor(@Inject(View) view) {
|
||||
constructor(@Inject(AppView) view) {
|
||||
this.view = view;
|
||||
}
|
||||
}
|
||||
|
@ -596,7 +596,7 @@ export function main() {
|
|||
var view = new DummyView();
|
||||
var inj = injector([], null, null, new PreBuiltObjects(view, null, null, null));
|
||||
|
||||
expect(inj.get(View)).toEqual(view);
|
||||
expect(inj.get(AppView)).toEqual(view);
|
||||
});
|
||||
|
||||
it("should return element", function () {
|
||||
|
@ -699,11 +699,11 @@ export function main() {
|
|||
function createpreBuildObject(eventName, eventHandler) {
|
||||
var handlers = StringMapWrapper.create();
|
||||
StringMapWrapper.set(handlers, eventName, eventHandler);
|
||||
var pv = new ProtoView(null, null, null);
|
||||
var pv = new AppProtoView(null, null, null);
|
||||
pv.bindElement(null, 0, null, null, null);
|
||||
pv.bindEvent(eventName, new Parser(new Lexer()).parseAction('handler()', ''));
|
||||
|
||||
var view = new View(pv, MapWrapper.create());
|
||||
var view = new AppView(pv, MapWrapper.create());
|
||||
view.context = new ContextWithHandler(eventHandler);
|
||||
return new PreBuiltObjects(view, null, null, null);
|
||||
}
|
||||
|
@ -742,8 +742,8 @@ export function main() {
|
|||
|
||||
beforeEach( () => {
|
||||
renderer = new FakeRenderer();
|
||||
var protoView = new ProtoView(renderer, null, null);
|
||||
view = new View(protoView, MapWrapper.create());
|
||||
var protoView = new AppProtoView(renderer, null, null);
|
||||
view = new AppView(protoView, MapWrapper.create());
|
||||
view.render = new ViewRef();
|
||||
});
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@ import {dynamicChangeDetection,
|
|||
ChangeDetection, DynamicChangeDetection, Pipe, PipeRegistry, BindingPropagationConfig, ON_PUSH} from 'angular2/change_detection';
|
||||
|
||||
import {Decorator, Component, Viewport, DynamicComponent} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {Parent, Ancestor} from 'angular2/src/core/annotations/visibility';
|
||||
import {EventEmitter, Attribute} from 'angular2/src/core/annotations/di';
|
||||
import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader';
|
||||
|
@ -45,7 +45,7 @@ export function main() {
|
|||
|
||||
describe('react to record changes', function() {
|
||||
it('should consume text node changes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div>{{ctxProp}}</div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div>{{ctxProp}}</div>'}));
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
ctx.ctxProp = 'Hello World!';
|
||||
|
||||
|
@ -56,7 +56,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should consume element binding changes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div [id]="ctxProp"></div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div [id]="ctxProp"></div>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -69,7 +69,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should consume binding to aria-* attributes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div [attr.aria-label]="ctxProp"></div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div [attr.aria-label]="ctxProp"></div>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -86,7 +86,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should consume binding to property names where attr name and property name do not match', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div [tabindex]="ctxNumProp"></div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div [tabindex]="ctxNumProp"></div>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -102,7 +102,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should consume binding to camel-cased properties using dash-cased syntax in templates', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<input [read-only]="ctxBoolProp">'}));
|
||||
tb.overrideView(MyComp, new View({template: '<input [read-only]="ctxBoolProp">'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -118,7 +118,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should consume binding to inner-html', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div inner-html="{{ctxProp}}"></div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div inner-html="{{ctxProp}}"></div>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -135,7 +135,7 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should ignore bindings to unknown properties', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: '<div unknown="{{ctxProp}}"></div>'}));
|
||||
tb.overrideView(MyComp, new View({template: '<div unknown="{{ctxProp}}"></div>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -155,7 +155,7 @@ export function main() {
|
|||
'<div my-dir elprop="Hi {{\'there!\'}}"></div>' +
|
||||
'<div my-dir elprop="One more {{ctxProp}}"></div>' +
|
||||
'</div>'
|
||||
tb.overrideTemplate(MyComp, new Template({inline: tpl, directives: [MyDir]}));
|
||||
tb.overrideView(MyComp, new View({template: tpl, directives: [MyDir]}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
||||
|
@ -181,9 +181,9 @@ export function main() {
|
|||
});
|
||||
|
||||
it("should support pipes in bindings and bind config", inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({
|
||||
inline: '<component-with-pipes #comp [prop]="ctxProp | double"></component-with-pipes>',
|
||||
tb.overrideView(MyComp,
|
||||
new View({
|
||||
template: '<component-with-pipes #comp [prop]="ctxProp | double"></component-with-pipes>',
|
||||
directives: [ComponentWithPipes]
|
||||
}));
|
||||
|
||||
|
@ -202,8 +202,8 @@ export function main() {
|
|||
});
|
||||
|
||||
it('should support nested components.', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<child-cmp></child-cmp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<child-cmp></child-cmp>',
|
||||
directives: [ChildComp]
|
||||
}));
|
||||
|
||||
|
@ -218,9 +218,9 @@ export function main() {
|
|||
|
||||
// GH issue 328 - https://github.com/angular/angular/issues/328
|
||||
it('should support different directive types on a single node', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({
|
||||
inline: '<child-cmp my-dir [elprop]="ctxProp"></child-cmp>',
|
||||
tb.overrideView(MyComp,
|
||||
new View({
|
||||
template: '<child-cmp my-dir [elprop]="ctxProp"></child-cmp>',
|
||||
directives: [MyDir, ChildComp]
|
||||
}));
|
||||
|
||||
|
@ -238,10 +238,10 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should support directives where a binding attribute is not given', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({
|
||||
tb.overrideView(MyComp,
|
||||
new View({
|
||||
// No attribute "el-prop" specified.
|
||||
inline: '<p my-dir></p>',
|
||||
template: '<p my-dir></p>',
|
||||
directives: [MyDir]
|
||||
}));
|
||||
|
||||
|
@ -251,9 +251,9 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should support directives where a selector matches property binding', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({
|
||||
inline: '<p [id]="ctxProp"></p>',
|
||||
tb.overrideView(MyComp,
|
||||
new View({
|
||||
template: '<p [id]="ctxProp"></p>',
|
||||
directives: [IdComponent]
|
||||
}));
|
||||
|
||||
|
@ -274,9 +274,9 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should support template directives via `<template>` elements.', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({
|
||||
inline: '<div><template some-viewport var-greeting="some-tmpl"><copy-me>{{greeting}}</copy-me></template></div>',
|
||||
tb.overrideView(MyComp,
|
||||
new View({
|
||||
template: '<div><template some-viewport var-greeting="some-tmpl"><copy-me>{{greeting}}</copy-me></template></div>',
|
||||
directives: [SomeViewport]
|
||||
}));
|
||||
|
||||
|
@ -294,8 +294,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should support template directives via `template` attribute.', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<div><copy-me template="some-viewport: var greeting=some-tmpl">{{greeting}}</copy-me></div>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<div><copy-me template="some-viewport: var greeting=some-tmpl">{{greeting}}</copy-me></div>',
|
||||
directives: [SomeViewport]
|
||||
}));
|
||||
|
||||
|
@ -313,8 +313,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should assign the component instance to a var-', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<p><child-cmp var-alice></child-cmp></p>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<p><child-cmp var-alice></child-cmp></p>',
|
||||
directives: [ChildComp]
|
||||
}));
|
||||
|
||||
|
@ -328,8 +328,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should assign two component instances each with a var-', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<p><child-cmp var-alice></child-cmp><child-cmp var-bob></p>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<p><child-cmp var-alice></child-cmp><child-cmp var-bob></p>',
|
||||
directives: [ChildComp]
|
||||
}));
|
||||
|
||||
|
@ -345,8 +345,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should assign the component instance to a var- with shorthand syntax', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<child-cmp #alice></child-cmp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<child-cmp #alice></child-cmp>',
|
||||
directives: [ChildComp]
|
||||
}));
|
||||
|
||||
|
@ -360,8 +360,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should assign the element instance to a user-defined variable', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({inline: '<p><div var-alice><i>Hello</i></div></p>'}));
|
||||
tb.overrideView(MyComp,
|
||||
new View({template: '<p><div var-alice><i>Hello</i></div></p>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
expect(view.rawView.locals).not.toBe(null);
|
||||
|
@ -376,8 +376,8 @@ export function main() {
|
|||
|
||||
|
||||
it('should assign the element instance to a user-defined variable with camelCase using dash-case', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp,
|
||||
new Template({inline: '<p><div var-super-alice><i>Hello</i></div></p>'}));
|
||||
tb.overrideView(MyComp,
|
||||
new View({template: '<p><div var-super-alice><i>Hello</i></div></p>'}));
|
||||
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
expect(view.rawView.locals).not.toBe(null);
|
||||
|
@ -394,8 +394,8 @@ export function main() {
|
|||
it("can be used to disable the change detection of the component's template",
|
||||
inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<push-cmp #cmp></push-cmp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<push-cmp #cmp></push-cmp>',
|
||||
directives: [[[PushBasedComp]]]
|
||||
}));
|
||||
|
||||
|
@ -418,8 +418,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should not affect updating properties on the component', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<push-cmp [prop]="ctxProp" #cmp></push-cmp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<push-cmp [prop]="ctxProp" #cmp></push-cmp>',
|
||||
directives: [[[PushBasedComp]]]
|
||||
}));
|
||||
|
||||
|
@ -441,8 +441,8 @@ export function main() {
|
|||
});
|
||||
|
||||
it('should create a component that injects a @Parent', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<some-directive><cmp-with-parent #child></cmp-with-parent></some-directive>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<some-directive><cmp-with-parent #child></cmp-with-parent></some-directive>',
|
||||
directives: [SomeDirective, CompWithParent]
|
||||
}));
|
||||
|
||||
|
@ -456,8 +456,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should create a component that injects an @Ancestor', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: `
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: `
|
||||
<some-directive>
|
||||
<p>
|
||||
<cmp-with-ancestor #child></cmp-with-ancestor>
|
||||
|
@ -476,8 +476,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should create a component that injects an @Ancestor through viewport directive', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: `
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: `
|
||||
<some-directive>
|
||||
<p *if="true">
|
||||
<cmp-with-ancestor #child></cmp-with-ancestor>
|
||||
|
@ -498,8 +498,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should support events via EventEmitter', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<div emitter listener></div>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<div emitter listener></div>',
|
||||
directives: [DecoratorEmitingEvent, DecoratorListeningEvent]
|
||||
}));
|
||||
|
||||
|
@ -523,8 +523,8 @@ export function main() {
|
|||
|
||||
if (DOM.supportsDOMEvents()) {
|
||||
it('should support render events', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<div listener></div>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<div listener></div>',
|
||||
directives: [DecoratorListeningDomEvent]
|
||||
}));
|
||||
|
||||
|
@ -545,8 +545,8 @@ export function main() {
|
|||
|
||||
describe("dynamic components", () => {
|
||||
it('should support loading components dynamically', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<dynamic-comp #dynamic></dynamic-comp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<dynamic-comp #dynamic></dynamic-comp>',
|
||||
directives: [DynamicComp]
|
||||
}));
|
||||
|
||||
|
@ -563,8 +563,8 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should inject dependencies of the dynamically-loaded component', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<dynamic-comp #dynamic></dynamic-comp>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<dynamic-comp #dynamic></dynamic-comp>',
|
||||
directives: [DynamicComp]
|
||||
}));
|
||||
|
||||
|
@ -579,8 +579,8 @@ export function main() {
|
|||
});
|
||||
|
||||
it('should support static attributes', inject([TestBed, AsyncTestCompleter], (tb, async) => {
|
||||
tb.overrideTemplate(MyComp, new Template({
|
||||
inline: '<input static type="text" title></input>',
|
||||
tb.overrideView(MyComp, new View({
|
||||
template: '<input static type="text" title>',
|
||||
directives: [NeedsAttribute]
|
||||
}));
|
||||
tb.createView(MyComp, {context: ctx}).then((view) => {
|
||||
|
@ -605,7 +605,7 @@ export function main() {
|
|||
if (assertionsEnabled()) {
|
||||
|
||||
function expectCompileError(tb, inlineTpl, errMessage, done) {
|
||||
tb.overrideTemplate(MyComp, new Template({inline: inlineTpl}));
|
||||
tb.overrideView(MyComp, new View({template: inlineTpl}));
|
||||
PromiseWrapper.then(tb.createView(MyComp),
|
||||
(value) => {
|
||||
throw new BaseException("Test failure: should not have come here as an exception was expected");
|
||||
|
@ -673,10 +673,10 @@ class DynamicComp {
|
|||
|
||||
@Component({
|
||||
selector: 'hello-cmp',
|
||||
services: [DynamicallyCreatedComponentService]
|
||||
injectables: [DynamicallyCreatedComponentService]
|
||||
})
|
||||
@Template({
|
||||
inline: "{{greeting}}"
|
||||
@View({
|
||||
template: "{{greeting}}"
|
||||
})
|
||||
class DynamicallyCreatedCmp {
|
||||
greeting:string;
|
||||
|
@ -689,7 +689,7 @@ class DynamicallyCreatedCmp {
|
|||
|
||||
@Decorator({
|
||||
selector: '[my-dir]',
|
||||
bind: {'dirProp':'elprop'}
|
||||
properties: {'dirProp':'elprop'}
|
||||
})
|
||||
class MyDir {
|
||||
dirProp:string;
|
||||
|
@ -700,12 +700,12 @@ class MyDir {
|
|||
|
||||
@Component({
|
||||
selector: 'push-cmp',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'prop'
|
||||
},
|
||||
changeDetection:ON_PUSH
|
||||
})
|
||||
@Template({inline: '{{field}}'})
|
||||
@View({template: '{{field}}'})
|
||||
class PushBasedComp {
|
||||
numberOfChecks:number;
|
||||
bpc:BindingPropagationConfig;
|
||||
|
@ -727,7 +727,7 @@ class PushBasedComp {
|
|||
}
|
||||
|
||||
@Component()
|
||||
@Template({directives: [
|
||||
@View({directives: [
|
||||
]})
|
||||
class MyComp {
|
||||
ctxProp:string;
|
||||
|
@ -743,12 +743,12 @@ class MyComp {
|
|||
|
||||
@Component({
|
||||
selector: 'component-with-pipes',
|
||||
bind: {
|
||||
properties: {
|
||||
"prop": "prop | double"
|
||||
}
|
||||
})
|
||||
@Template({
|
||||
inline: ''
|
||||
@View({
|
||||
template: ''
|
||||
})
|
||||
class ComponentWithPipes {
|
||||
prop:string;
|
||||
|
@ -756,11 +756,11 @@ class ComponentWithPipes {
|
|||
|
||||
@Component({
|
||||
selector: 'child-cmp',
|
||||
services: [MyService]
|
||||
injectables: [MyService]
|
||||
})
|
||||
@Template({
|
||||
@View({
|
||||
directives: [MyDir],
|
||||
inline: '{{ctxProp}}'
|
||||
template: '{{ctxProp}}'
|
||||
})
|
||||
class ChildComp {
|
||||
ctxProp:string;
|
||||
|
@ -779,8 +779,8 @@ class SomeDirective { }
|
|||
@Component({
|
||||
selector: 'cmp-with-parent'
|
||||
})
|
||||
@Template({
|
||||
inline: '<p>Component with an injected parent</p>',
|
||||
@View({
|
||||
template: '<p>Component with an injected parent</p>',
|
||||
directives: [SomeDirective]
|
||||
})
|
||||
class CompWithParent {
|
||||
|
@ -793,8 +793,8 @@ class CompWithParent {
|
|||
@Component({
|
||||
selector: 'cmp-with-ancestor'
|
||||
})
|
||||
@Template({
|
||||
inline: '<p>Component with an injected ancestor</p>',
|
||||
@View({
|
||||
template: '<p>Component with an injected ancestor</p>',
|
||||
directives: [SomeDirective]
|
||||
})
|
||||
class CompWithAncestor {
|
||||
|
@ -806,7 +806,7 @@ class CompWithAncestor {
|
|||
|
||||
@Component({
|
||||
selector: '[child-cmp2]',
|
||||
services: [MyService]
|
||||
injectables: [MyService]
|
||||
})
|
||||
class ChildComp2 {
|
||||
ctxProp:string;
|
||||
|
@ -856,7 +856,7 @@ class DoublePipeFactory {
|
|||
|
||||
@Decorator({
|
||||
selector: '[emitter]',
|
||||
events: {'event': 'onEvent($event)'}
|
||||
hostListeners: {'event': 'onEvent($event)'}
|
||||
})
|
||||
class DecoratorEmitingEvent {
|
||||
msg: string;
|
||||
|
@ -878,7 +878,7 @@ class DecoratorEmitingEvent {
|
|||
|
||||
@Decorator({
|
||||
selector: '[listener]',
|
||||
events: {'event': 'onEvent($event)'}
|
||||
hostListeners: {'event': 'onEvent($event)'}
|
||||
})
|
||||
class DecoratorListeningEvent {
|
||||
msg: string;
|
||||
|
@ -894,7 +894,7 @@ class DecoratorListeningEvent {
|
|||
|
||||
@Decorator({
|
||||
selector: '[listener]',
|
||||
events: {'domEvent': 'onEvent($event.type)'}
|
||||
hostListeners: {'domEvent': 'onEvent($event.type)'}
|
||||
})
|
||||
class DecoratorListeningDomEvent {
|
||||
eventType: string;
|
||||
|
@ -910,10 +910,10 @@ class DecoratorListeningDomEvent {
|
|||
|
||||
@Component({
|
||||
selector: '[id]',
|
||||
bind: {'id': 'id'}
|
||||
properties: {'id': 'id'}
|
||||
})
|
||||
@Template({
|
||||
inline: '<div>Matched on id with {{id}}</div>'
|
||||
@View({
|
||||
template: '<div>Matched on id with {{id}}</div>'
|
||||
})
|
||||
class IdComponent {
|
||||
id: string;
|
||||
|
|
|
@ -17,7 +17,7 @@ import {TestBed} from 'angular2/src/test_lib/test_bed';
|
|||
import {QueryList} from 'angular2/src/core/compiler/query_list';
|
||||
import {Query} from 'angular2/src/core/annotations/di';
|
||||
|
||||
import {Decorator, Component, Template, If, For} from 'angular2/angular2';
|
||||
import {Decorator, Component, View, If, For} from 'angular2/angular2';
|
||||
|
||||
import {BrowserDomAdapter} from 'angular2/src/dom/browser_adapter';
|
||||
|
||||
|
@ -84,9 +84,9 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'needs-query'})
|
||||
@Template({
|
||||
@View({
|
||||
directives: [For],
|
||||
inline: '<div *for="var dir of query">{{dir.text}}|</div>'
|
||||
template: '<div *for="var dir of query">{{dir.text}}|</div>'
|
||||
})
|
||||
class NeedsQuery {
|
||||
query: QueryList;
|
||||
|
@ -99,7 +99,7 @@ var _constructiontext = 0;
|
|||
|
||||
@Decorator({
|
||||
selector: '[text]',
|
||||
bind: {
|
||||
properties: {
|
||||
'text': 'text'
|
||||
}
|
||||
})
|
||||
|
@ -109,7 +109,7 @@ class TextDirective {
|
|||
}
|
||||
|
||||
@Component({selector: 'my-comp'})
|
||||
@Template({
|
||||
@View({
|
||||
directives: [NeedsQuery, TextDirective, If, For]
|
||||
})
|
||||
class MyComp {
|
||||
|
|
|
@ -15,7 +15,7 @@ import {
|
|||
|
||||
import {StringMapWrapper} from 'angular2/src/facade/collection';
|
||||
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
|
||||
import {TestBed} from 'angular2/src/test_lib/test_bed';
|
||||
|
@ -141,7 +141,7 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'test-cmp'})
|
||||
@Template({directives: [CSSClass]})
|
||||
@View({directives: [CSSClass]})
|
||||
class TestComponent {
|
||||
condition:boolean;
|
||||
expr;
|
||||
|
|
|
@ -16,7 +16,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {ListWrapper} from 'angular2/src/facade/collection';
|
||||
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {For} from 'angular2/src/directives/for';
|
||||
|
||||
|
@ -231,7 +231,7 @@ class Foo {
|
|||
}
|
||||
|
||||
@Component({selector: 'test-cmp'})
|
||||
@Template({directives: [For]})
|
||||
@View({directives: [For]})
|
||||
class TestComponent {
|
||||
items: any;
|
||||
constructor() {
|
||||
|
|
|
@ -17,7 +17,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {TestBed} from 'angular2/src/test_lib/test_bed';
|
||||
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {If} from 'angular2/src/directives/if';
|
||||
|
||||
|
@ -183,7 +183,7 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'test-cmp'})
|
||||
@Template({directives: [If]})
|
||||
@View({directives: [If]})
|
||||
class TestComponent {
|
||||
booleanCondition: boolean;
|
||||
nestedBooleanCondition: boolean;
|
||||
|
|
|
@ -13,7 +13,7 @@ import {
|
|||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
|
||||
import {Decorator, Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {NgElement} from 'angular2/src/core/compiler/ng_element';
|
||||
|
||||
|
@ -55,7 +55,7 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'test-cmp'})
|
||||
@Template({directives: [NonBindable, TestDecorator]})
|
||||
@View({directives: [NonBindable, TestDecorator]})
|
||||
class TestComponent {
|
||||
text: string;
|
||||
constructor() {
|
||||
|
|
|
@ -13,7 +13,7 @@ import {
|
|||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {Switch, SwitchWhen, SwitchDefault} from 'angular2/src/directives/switch';
|
||||
|
||||
|
@ -139,7 +139,7 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'test-cmp'})
|
||||
@Template({directives: [Switch, SwitchWhen, SwitchDefault]})
|
||||
@View({directives: [Switch, SwitchWhen, SwitchDefault]})
|
||||
class TestComponent {
|
||||
switchValue: any;
|
||||
when1: any;
|
||||
|
|
|
@ -16,7 +16,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
|
||||
import {Inject} from 'angular2/di';
|
||||
|
||||
import {Component, Decorator, Template, PropertySetter} from 'angular2/angular2';
|
||||
import {Component, Decorator, View, PropertySetter} from 'angular2/angular2';
|
||||
|
||||
import {TestBed} from 'angular2/src/test_lib/test_bed';
|
||||
|
||||
|
@ -367,7 +367,7 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: "my-comp"})
|
||||
@Template({directives: [
|
||||
@View({directives: [
|
||||
ControlGroupDirective,
|
||||
ControlDirective,
|
||||
WrappedValue,
|
||||
|
@ -386,7 +386,7 @@ class MyComp {
|
|||
|
||||
@Decorator({
|
||||
selector:'[wrapped-value]',
|
||||
events: {
|
||||
hostListeners: {
|
||||
'change' : 'handleOnChange($event.target.value)'
|
||||
}
|
||||
})
|
||||
|
|
|
@ -11,7 +11,7 @@ import {
|
|||
import {MockTemplateResolver} from 'angular2/src/mock/template_resolver_mock';
|
||||
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
|
||||
import {isBlank} from 'angular2/src/facade/lang';
|
||||
|
||||
|
@ -23,17 +23,17 @@ export function main() {
|
|||
resolver = new MockTemplateResolver();
|
||||
});
|
||||
|
||||
describe('Template overriding', () => {
|
||||
describe('View overriding', () => {
|
||||
it('should fallback to the default TemplateResolver when templates are not overridden', () => {
|
||||
var template = resolver.resolve(SomeComponent);
|
||||
expect(template.inline).toEqual('template');
|
||||
expect(template.template).toEqual('template');
|
||||
expect(template.directives).toEqual([SomeDirective]);
|
||||
});
|
||||
|
||||
it('should allow overriding a template', () => {
|
||||
resolver.setTemplate(SomeComponent, new Template({inline: 'overridden template'}));
|
||||
it('should allow overriding the @View', () => {
|
||||
resolver.setView(SomeComponent, new View({template: 'overridden template'}));
|
||||
var template = resolver.resolve(SomeComponent);
|
||||
expect(template.inline).toEqual('overridden template');
|
||||
expect(template.template).toEqual('overridden template');
|
||||
expect(isBlank(template.directives)).toBe(true);
|
||||
|
||||
});
|
||||
|
@ -41,24 +41,24 @@ export function main() {
|
|||
it('should not allow overriding a template after it has been resolved', () => {
|
||||
resolver.resolve(SomeComponent);
|
||||
expect(() => {
|
||||
resolver.setTemplate(SomeComponent, new Template({inline: 'overridden template'}));
|
||||
resolver.setView(SomeComponent, new View({template: 'overridden template'}));
|
||||
}).toThrowError('The component SomeComponent has already been compiled, its configuration can not be changed');
|
||||
});
|
||||
});
|
||||
|
||||
describe('inline definition overriding', () => {
|
||||
it('should allow overriding the default Template', () => {
|
||||
describe('inline template definition overriding', () => {
|
||||
it('should allow overriding the default template', () => {
|
||||
resolver.setInlineTemplate(SomeComponent, 'overridden template');
|
||||
var template = resolver.resolve(SomeComponent);
|
||||
expect(template.inline).toEqual('overridden template');
|
||||
expect(template.template).toEqual('overridden template');
|
||||
expect(template.directives).toEqual([SomeDirective]);
|
||||
});
|
||||
|
||||
it('should allow overriding an overriden template', () => {
|
||||
resolver.setTemplate(SomeComponent, new Template({inline: 'overridden template'}));
|
||||
it('should allow overriding an overriden @View', () => {
|
||||
resolver.setView(SomeComponent, new View({template: 'overridden template'}));
|
||||
resolver.setInlineTemplate(SomeComponent, 'overridden template x 2');
|
||||
var template = resolver.resolve(SomeComponent);
|
||||
expect(template.inline).toEqual('overridden template x 2');
|
||||
expect(template.template).toEqual('overridden template x 2');
|
||||
});
|
||||
|
||||
it('should not allow overriding a template after it has been resolved', () => {
|
||||
|
@ -78,8 +78,8 @@ export function main() {
|
|||
expect(template.directives[0]).toBe(SomeOtherDirective);
|
||||
});
|
||||
|
||||
it('should allow overriding a directive from an overriden template', () => {
|
||||
resolver.setTemplate(SomeComponent, new Template({directives: [SomeOtherDirective]}));
|
||||
it('should allow overriding a directive from an overriden @View', () => {
|
||||
resolver.setView(SomeComponent, new View({directives: [SomeOtherDirective]}));
|
||||
resolver.overrideTemplateDirective(SomeComponent, SomeOtherDirective, SomeComponent);
|
||||
var template = resolver.resolve(SomeComponent);
|
||||
expect(template.directives.length).toEqual(1);
|
||||
|
@ -103,8 +103,8 @@ export function main() {
|
|||
}
|
||||
|
||||
@Component({selector: 'cmp'})
|
||||
@Template({
|
||||
inline: 'template',
|
||||
@View({
|
||||
template: 'template',
|
||||
directives: [SomeDirective],
|
||||
})
|
||||
class SomeComponent {
|
||||
|
|
|
@ -17,7 +17,7 @@ import {Type, isBlank, stringify, isPresent} from 'angular2/src/facade/lang';
|
|||
import {PromiseWrapper, Promise} from 'angular2/src/facade/async';
|
||||
|
||||
import {Compiler, CompilerCache} from 'angular2/src/render/dom/compiler/compiler';
|
||||
import {ProtoView, Template} from 'angular2/src/render/api';
|
||||
import {ProtoViewDto, ViewDefinition} from 'angular2/src/render/api';
|
||||
import {CompileElement} from 'angular2/src/render/dom/compiler/compile_element';
|
||||
import {CompileStep} from 'angular2/src/render/dom/compiler/compile_step'
|
||||
import {CompileStepFactory} from 'angular2/src/render/dom/compiler/compile_step_factory';
|
||||
|
@ -39,13 +39,13 @@ export function runCompilerCommonTests() {
|
|||
return new Compiler(mockStepFactory, tplLoader);
|
||||
}
|
||||
|
||||
it('should run the steps and build the ProtoView of the root element', inject([AsyncTestCompleter], (async) => {
|
||||
it('should run the steps and build the AppProtoView of the root element', inject([AsyncTestCompleter], (async) => {
|
||||
var compiler = createCompiler((parent, current, control) => {
|
||||
current.inheritedProtoView.bindVariable('b', 'a');
|
||||
});
|
||||
compiler.compile(new Template({
|
||||
compiler.compile(new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '<div></div>'
|
||||
template: '<div></div>'
|
||||
})).then( (protoView) => {
|
||||
expect(protoView.variableBindings).toEqual(MapWrapper.createFromStringMap({
|
||||
'a': 'b'
|
||||
|
@ -56,9 +56,9 @@ export function runCompilerCommonTests() {
|
|||
|
||||
it('should use the inline template and compile in sync', inject([AsyncTestCompleter], (async) => {
|
||||
var compiler = createCompiler(EMPTY_STEP);
|
||||
compiler.compile(new Template({
|
||||
compiler.compile(new ViewDefinition({
|
||||
componentId: 'someId',
|
||||
inline: 'inline component'
|
||||
template: 'inline component'
|
||||
})).then( (protoView) => {
|
||||
expect(DOM.getInnerHTML(protoView.render.delegate.element)).toEqual('inline component');
|
||||
async.done();
|
||||
|
@ -70,7 +70,7 @@ export function runCompilerCommonTests() {
|
|||
'someUrl': 'url component'
|
||||
});
|
||||
var compiler = createCompiler(EMPTY_STEP, urlData);
|
||||
compiler.compile(new Template({
|
||||
compiler.compile(new ViewDefinition({
|
||||
componentId: 'someId',
|
||||
absUrl: 'someUrl'
|
||||
})).then( (protoView) => {
|
||||
|
@ -81,7 +81,7 @@ export function runCompilerCommonTests() {
|
|||
|
||||
it('should report loading errors', inject([AsyncTestCompleter], (async) => {
|
||||
var compiler = createCompiler(EMPTY_STEP, MapWrapper.create());
|
||||
PromiseWrapper.catchError(compiler.compile(new Template({
|
||||
PromiseWrapper.catchError(compiler.compile(new ViewDefinition({
|
||||
componentId: 'someId',
|
||||
absUrl: 'someUrl'
|
||||
})), (e) => {
|
||||
|
@ -102,9 +102,9 @@ export function runCompilerCommonTests() {
|
|||
});
|
||||
|
||||
// It should always return a Promise because the subtask is async
|
||||
var pvPromise = compiler.compile(new Template({
|
||||
var pvPromise = compiler.compile(new ViewDefinition({
|
||||
componentId: 'someId',
|
||||
inline: 'some component'
|
||||
template: 'some component'
|
||||
}));
|
||||
expect(pvPromise).toBePromise();
|
||||
expect(subTasksCompleted).toEqual(false);
|
||||
|
@ -159,9 +159,9 @@ class FakeTemplateLoader extends TemplateLoader {
|
|||
this._urlData = urlData;
|
||||
}
|
||||
|
||||
load(template: Template) {
|
||||
if (isPresent(template.inline)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.inline));
|
||||
load(template: ViewDefinition) {
|
||||
if (isPresent(template.template)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.template));
|
||||
}
|
||||
|
||||
if (isPresent(template.absUrl)) {
|
||||
|
|
|
@ -6,7 +6,7 @@ import {CompilePipeline} from 'angular2/src/render/dom/compiler/compile_pipeline
|
|||
import {CompileStep} from 'angular2/src/render/dom/compiler/compile_step';
|
||||
import {CompileElement} from 'angular2/src/render/dom/compiler/compile_element';
|
||||
import {CompileControl} from 'angular2/src/render/dom/compiler/compile_control';
|
||||
import {Template, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
import {ViewDefinition, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
import {Lexer, Parser} from 'angular2/change_detection';
|
||||
|
||||
export function main() {
|
||||
|
@ -232,7 +232,7 @@ var someDecoratorIgnoringChildren = new DirectiveMetadata({
|
|||
|
||||
var someDecoratorWithProps = new DirectiveMetadata({
|
||||
selector: '[some-decor-props]',
|
||||
bind: MapWrapper.createFromStringMap({
|
||||
properties: MapWrapper.createFromStringMap({
|
||||
'dirProp': 'elProp',
|
||||
'doubleProp': 'elProp | double'
|
||||
}),
|
||||
|
@ -242,7 +242,7 @@ var someDecoratorWithProps = new DirectiveMetadata({
|
|||
|
||||
var someDecoratorWithEvents = new DirectiveMetadata({
|
||||
selector: '[some-decor-events]',
|
||||
events: MapWrapper.createFromStringMap({
|
||||
hostListeners: MapWrapper.createFromStringMap({
|
||||
'click': 'doIt()'
|
||||
})
|
||||
});
|
||||
|
|
|
@ -14,7 +14,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
|
||||
import {Template} from 'angular2/src/render/api';
|
||||
import {ViewDefinition} from 'angular2/src/render/api';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {MockXHR} from 'angular2/src/mock/xhr_mock';
|
||||
|
||||
|
@ -28,16 +28,16 @@ export function main() {
|
|||
});
|
||||
|
||||
it('should load inline templates', inject([AsyncTestCompleter], (async) => {
|
||||
var template = new Template({inline: 'inline template'});
|
||||
var template = new ViewDefinition({template: 'template template'});
|
||||
loader.load(template).then( (el) => {
|
||||
expect(DOM.content(el)).toHaveText('inline template');
|
||||
expect(DOM.content(el)).toHaveText('template template');
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
it('should load templates through XHR', inject([AsyncTestCompleter], (async) => {
|
||||
xhr.expect('base/foo', 'xhr template');
|
||||
var template = new Template({absUrl: 'base/foo'});
|
||||
var template = new ViewDefinition({absUrl: 'base/foo'});
|
||||
loader.load(template).then((el) => {
|
||||
expect(DOM.content(el)).toHaveText('xhr template');
|
||||
async.done();
|
||||
|
@ -48,7 +48,7 @@ export function main() {
|
|||
it('should cache template loaded through XHR', inject([AsyncTestCompleter], (async) => {
|
||||
var firstEl;
|
||||
xhr.expect('base/foo', 'xhr template');
|
||||
var template = new Template({absUrl: 'base/foo'});
|
||||
var template = new ViewDefinition({absUrl: 'base/foo'});
|
||||
loader.load(template)
|
||||
.then((el) => {
|
||||
firstEl = el;
|
||||
|
@ -63,14 +63,14 @@ export function main() {
|
|||
}));
|
||||
|
||||
it('should throw when no template is defined', () => {
|
||||
var template = new Template({inline: null, absUrl: null});
|
||||
var template = new ViewDefinition({template: null, absUrl: null});
|
||||
expect(() => loader.load(template))
|
||||
.toThrowError('Templates should have either their url or inline property set');
|
||||
.toThrowError('View should have either the url or template property set');
|
||||
});
|
||||
|
||||
it('should return a rejected Promise when xhr loading fails', inject([AsyncTestCompleter], (async) => {
|
||||
xhr.expect('base/foo', null);
|
||||
var template = new Template({absUrl: 'base/foo'});
|
||||
var template = new ViewDefinition({absUrl: 'base/foo'});
|
||||
PromiseWrapper.then(loader.load(template),
|
||||
function(_) { throw 'Unexpected response'; },
|
||||
function(error) {
|
||||
|
|
|
@ -15,7 +15,7 @@ import {
|
|||
|
||||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
|
||||
import {ProtoView, Template, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
import {ProtoViewDto, ViewDefinition, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
|
||||
import {IntegrationTestbed, LoggingEventDispatcher, FakeEvent} from './integration_testbed';
|
||||
|
||||
|
@ -53,9 +53,9 @@ export function main() {
|
|||
it('should add a static component', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer();
|
||||
renderer.createRootProtoView(rootEl, 'someComponentId').then( (rootProtoView) => {
|
||||
var template = new Template({
|
||||
var template = new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: 'hello',
|
||||
template: 'hello',
|
||||
directives: []
|
||||
});
|
||||
renderer.compile(template).then( (pv) => {
|
||||
|
@ -70,9 +70,9 @@ export function main() {
|
|||
it('should add a a dynamic component', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer();
|
||||
renderer.createRootProtoView(rootEl, 'someComponentId').then( (rootProtoView) => {
|
||||
var template = new Template({
|
||||
var template = new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: 'hello',
|
||||
template: 'hello',
|
||||
directives: []
|
||||
});
|
||||
renderer.compile(template).then( (pv) => {
|
||||
|
@ -87,9 +87,9 @@ export function main() {
|
|||
|
||||
it('should update text nodes', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '{{a}}',
|
||||
template: '{{a}}',
|
||||
directives: []
|
||||
})]
|
||||
});
|
||||
|
@ -103,9 +103,9 @@ export function main() {
|
|||
|
||||
it('should update element properties', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '<input [value]="someProp">',
|
||||
template: '<input [value]="someProp">',
|
||||
directives: []
|
||||
})]
|
||||
});
|
||||
|
@ -119,9 +119,9 @@ export function main() {
|
|||
|
||||
it('should add and remove views to and from containers', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '<template>hello</template>',
|
||||
template: '<template>hello</template>',
|
||||
directives: []
|
||||
})]
|
||||
});
|
||||
|
@ -144,9 +144,9 @@ export function main() {
|
|||
|
||||
it('should cache views', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '<template>hello</template>',
|
||||
template: '<template>hello</template>',
|
||||
directives: []
|
||||
})],
|
||||
viewCacheCapacity: 2
|
||||
|
@ -170,9 +170,9 @@ export function main() {
|
|||
// the event expression processing...
|
||||
xit('should handle events', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'someComponent',
|
||||
inline: '<input (change)="$event.target.value">',
|
||||
template: '<input (change)="$event.target.value">',
|
||||
directives: []
|
||||
})]
|
||||
});
|
||||
|
|
|
@ -6,7 +6,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
|
|||
import {Parser, Lexer} from 'angular2/change_detection';
|
||||
import {DirectDomRenderer} from 'angular2/src/render/dom/direct_dom_renderer';
|
||||
import {Compiler} from 'angular2/src/render/dom/compiler/compiler';
|
||||
import {ProtoViewRef, ProtoView, Template, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
import {ProtoViewRef, ProtoViewDto, ViewDefinition, ViewContainerRef, EventDispatcher, DirectiveMetadata} from 'angular2/src/render/api';
|
||||
import {DefaultStepFactory} from 'angular2/src/render/dom/compiler/compile_step_factory';
|
||||
import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
|
@ -20,7 +20,7 @@ export class IntegrationTestbed {
|
|||
renderer;
|
||||
parser;
|
||||
eventPlugin;
|
||||
_templates:Map<string, Template>;
|
||||
_templates:Map<string, ViewDefinition>;
|
||||
|
||||
constructor({urlData, viewCacheCapacity, shadowDomStrategy, templates}) {
|
||||
this._templates = MapWrapper.create();
|
||||
|
@ -48,7 +48,7 @@ export class IntegrationTestbed {
|
|||
this.renderer = new DirectDomRenderer(compiler, viewFactory, shadowDomStrategy);
|
||||
}
|
||||
|
||||
compile(rootEl, componentId):Promise<ProtoView> {
|
||||
compile(rootEl, componentId):Promise<ProtoViewDto> {
|
||||
return this.renderer.createRootProtoView(rootEl, componentId).then( (rootProtoView) => {
|
||||
return this._compileNestedProtoViews(rootProtoView, [
|
||||
new DirectiveMetadata({
|
||||
|
@ -59,13 +59,13 @@ export class IntegrationTestbed {
|
|||
});
|
||||
}
|
||||
|
||||
_compile(template):Promise<ProtoView> {
|
||||
_compile(template):Promise<ProtoViewDto> {
|
||||
return this.renderer.compile(template).then( (protoView) => {
|
||||
return this._compileNestedProtoViews(protoView, template.directives);
|
||||
});
|
||||
}
|
||||
|
||||
_compileNestedProtoViews(protoView, directives):Promise<ProtoView> {
|
||||
_compileNestedProtoViews(protoView, directives):Promise<ProtoViewDto> {
|
||||
var childComponentRenderPvRefs = [];
|
||||
var nestedPVPromises = [];
|
||||
ListWrapper.forEach(protoView.elementBinders, (elementBinder) => {
|
||||
|
@ -119,9 +119,9 @@ class FakeTemplateLoader extends TemplateLoader {
|
|||
this._urlData = urlData;
|
||||
}
|
||||
|
||||
load(template: Template) {
|
||||
if (isPresent(template.inline)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.inline));
|
||||
load(template: ViewDefinition) {
|
||||
if (isPresent(template.template)) {
|
||||
return PromiseWrapper.resolve(DOM.createTemplate(template.template));
|
||||
}
|
||||
|
||||
if (isPresent(template.absUrl)) {
|
||||
|
@ -188,4 +188,4 @@ export class FakeEvent {
|
|||
constructor(target) {
|
||||
this.target = target;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ import {
|
|||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
import {StyleUrlResolver} from 'angular2/src/render/dom/shadow_dom/style_url_resolver';
|
||||
import {StyleInliner} from 'angular2/src/render/dom/shadow_dom/style_inliner';
|
||||
import {View} from 'angular2/src/render/dom/view/view';
|
||||
import {RenderView} from 'angular2/src/render/dom/view/view';
|
||||
|
||||
export function main() {
|
||||
describe('EmulatedScoped', () => {
|
||||
|
@ -47,7 +47,7 @@ export function main() {
|
|||
it('should attach the view nodes as child of the host element', () => {
|
||||
var host = el('<div><span>original content</span></div>');
|
||||
var nodes = el('<div>view</div>');
|
||||
var view = new View(null, [nodes], [], [], [], []);
|
||||
var view = new RenderView(null, [nodes], [], [], [], []);
|
||||
|
||||
strategy.attachTemplate(host, view);
|
||||
var firstChild = DOM.firstChild(host);
|
||||
|
|
|
@ -23,7 +23,7 @@ import {
|
|||
} from 'angular2/src/render/dom/shadow_dom/util';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
import {StyleUrlResolver} from 'angular2/src/render/dom/shadow_dom/style_url_resolver';
|
||||
import {View} from 'angular2/src/render/dom/view/view';
|
||||
import {RenderView} from 'angular2/src/render/dom/view/view';
|
||||
|
||||
export function main() {
|
||||
var strategy;
|
||||
|
@ -42,7 +42,7 @@ export function main() {
|
|||
it('should attach the view nodes as child of the host element', () => {
|
||||
var host = el('<div><span>original content</span></div>');
|
||||
var nodes = el('<div>view</div>');
|
||||
var view = new View(null, [nodes], [], [], [], []);
|
||||
var view = new RenderView(null, [nodes], [], [], [], []);
|
||||
|
||||
strategy.attachTemplate(host, view);
|
||||
var firstChild = DOM.firstChild(host);
|
||||
|
|
|
@ -4,11 +4,11 @@ import {ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
|
|||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
import {Content} from 'angular2/src/render/dom/shadow_dom/content_tag';
|
||||
import {LightDom} from 'angular2/src/render/dom/shadow_dom/light_dom';
|
||||
import {View} from 'angular2/src/render/dom/view/view';
|
||||
import {RenderView} from 'angular2/src/render/dom/view/view';
|
||||
import {ViewContainer} from 'angular2/src/render/dom/view/view_container';
|
||||
|
||||
@proxy
|
||||
@IMPLEMENTS(View)
|
||||
@IMPLEMENTS(RenderView)
|
||||
class FakeView {
|
||||
contentTags;
|
||||
viewContainers;
|
||||
|
|
|
@ -17,7 +17,7 @@ import {
|
|||
} from 'angular2/src/render/dom/shadow_dom/native_shadow_dom_strategy';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
import {StyleUrlResolver} from 'angular2/src/render/dom/shadow_dom/style_url_resolver';
|
||||
import {View} from 'angular2/src/render/dom/view/view';
|
||||
import {RenderView} from 'angular2/src/render/dom/view/view';
|
||||
|
||||
import {isPresent, isBlank} from 'angular2/src/facade/lang';
|
||||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
|
@ -35,7 +35,7 @@ export function main() {
|
|||
it('should attach the view nodes to the shadow root', () => {
|
||||
var host = el('<div><span>original content</span></div>');
|
||||
var nodes = el('<div>view</div>');
|
||||
var view = new View(null, [nodes], [], [], [], []);
|
||||
var view = new RenderView(null, [nodes], [], [], [], []);
|
||||
|
||||
strategy.attachTemplate(host, view);
|
||||
var shadowRoot = DOM.getShadowRoot(host);
|
||||
|
|
|
@ -17,7 +17,7 @@ import {MapWrapper, ListWrapper, StringMapWrapper} from 'angular2/src/facade/col
|
|||
import {DOM} from 'angular2/src/dom/dom_adapter';
|
||||
|
||||
import {
|
||||
ProtoView, Template, ViewContainerRef, DirectiveMetadata
|
||||
ProtoViewDto, ViewDefinition, ViewContainerRef, DirectiveMetadata
|
||||
} from 'angular2/src/render/api';
|
||||
|
||||
import {EmulatedScopedShadowDomStrategy} from 'angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy';
|
||||
|
@ -69,9 +69,9 @@ export function main() {
|
|||
|
||||
it('should support simple components', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<simple>' +
|
||||
template: '<simple>' +
|
||||
'<div>A</div>' +
|
||||
'</simple>',
|
||||
directives: [simple]
|
||||
|
@ -88,9 +88,9 @@ export function main() {
|
|||
|
||||
it('should support multiple content tags', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<multiple-content-tags>' +
|
||||
template: '<multiple-content-tags>' +
|
||||
'<div>B</div>' +
|
||||
'<div>C</div>' +
|
||||
'<div class="left">A</div>' +
|
||||
|
@ -109,9 +109,9 @@ export function main() {
|
|||
|
||||
it('should redistribute only direct children', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<multiple-content-tags>' +
|
||||
template: '<multiple-content-tags>' +
|
||||
'<div>B<div class="left">A</div></div>' +
|
||||
'<div>C</div>' +
|
||||
'</multiple-content-tags>',
|
||||
|
@ -129,9 +129,9 @@ export function main() {
|
|||
|
||||
it("should redistribute direct child viewcontainers when the light dom changes", inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<multiple-content-tags>' +
|
||||
template: '<multiple-content-tags>' +
|
||||
'<div><div template="manual" class="left">A</div></div>' +
|
||||
'<div>B</div>' +
|
||||
'</multiple-content-tags>',
|
||||
|
@ -161,9 +161,9 @@ export function main() {
|
|||
|
||||
it("should redistribute when the light dom changes", inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<multiple-content-tags>' +
|
||||
template: '<multiple-content-tags>' +
|
||||
'<div template="manual" class="left">A</div>' +
|
||||
'<div>B</div>' +
|
||||
'</multiple-content-tags>',
|
||||
|
@ -193,9 +193,9 @@ export function main() {
|
|||
|
||||
it("should support nested components", inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<outer-with-indirect-nested>' +
|
||||
template: '<outer-with-indirect-nested>' +
|
||||
'<div>A</div>' +
|
||||
'<div>B</div>' +
|
||||
'</outer-with-indirect-nested>',
|
||||
|
@ -213,9 +213,9 @@ export function main() {
|
|||
|
||||
it("should support nesting with content being direct child of a nested component", inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<outer>' +
|
||||
template: '<outer>' +
|
||||
'<div template="manual" class="left">A</div>' +
|
||||
'<div>B</div>' +
|
||||
'<div>C</div>' +
|
||||
|
@ -241,9 +241,9 @@ export function main() {
|
|||
|
||||
it('should redistribute when the shadow dom changes', inject([AsyncTestCompleter], (async) => {
|
||||
createRenderer({
|
||||
templates: [new Template({
|
||||
templates: [new ViewDefinition({
|
||||
componentId: 'main',
|
||||
inline: '<conditional-content>' +
|
||||
template: '<conditional-content>' +
|
||||
'<div class="left">A</div>' +
|
||||
'<div>B</div>' +
|
||||
'<div>C</div>' +
|
||||
|
@ -351,39 +351,39 @@ var autoViewportDirective = new DirectiveMetadata({
|
|||
});
|
||||
|
||||
var componentTemplates = [
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'simple',
|
||||
inline: 'SIMPLE(<content></content>)',
|
||||
template: 'SIMPLE(<content></content>)',
|
||||
directives: []
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'multiple-content-tags',
|
||||
inline: '(<content select=".left"></content>, <content></content>)',
|
||||
template: '(<content select=".left"></content>, <content></content>)',
|
||||
directives: []
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'outer-with-indirect-nested',
|
||||
inline: 'OUTER(<simple><div><content></content></div></simple>)',
|
||||
template: 'OUTER(<simple><div><content></content></div></simple>)',
|
||||
directives: [simple]
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'outer',
|
||||
inline: 'OUTER(<inner><content></content></inner>)',
|
||||
template: 'OUTER(<inner><content></content></inner>)',
|
||||
directives: [innerComponent]
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'inner',
|
||||
inline: 'INNER(<innerinner><content></content></innerinner>)',
|
||||
template: 'INNER(<innerinner><content></content></innerinner>)',
|
||||
directives: [innerInnerComponent]
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'innerinner',
|
||||
inline: 'INNERINNER(<content select=".left"></content>,<content></content>)',
|
||||
template: 'INNERINNER(<content select=".left"></content>,<content></content>)',
|
||||
directives: []
|
||||
}),
|
||||
new Template({
|
||||
new ViewDefinition({
|
||||
componentId: 'conditional-content',
|
||||
inline: '<div>(<div *auto="cond"><content select=".left"></content></div>, <content></content>)</div>',
|
||||
template: '<div>(<div *auto="cond"><content select=".left"></content></div>, <content></content>)</div>',
|
||||
directives: [autoViewportDirective]
|
||||
})
|
||||
];
|
||||
|
|
|
@ -17,7 +17,7 @@ var formatter = new DartFormatter();
|
|||
void allTests() {
|
||||
var reader = new TestAssetReader();
|
||||
|
||||
it('should generate a setter for a `bind` property in an annotation.',
|
||||
it('should generate a setter for a `properties` property in an annotation.',
|
||||
() async {
|
||||
var inputPath = 'bind_generator/basic_bind_files/bar.ng_deps.dart';
|
||||
var expected = formatter.format(
|
||||
|
|
|
@ -13,7 +13,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [],
|
||||
'annotations': const [
|
||||
const Decorator(
|
||||
selector: '[tool-tip]', bind: const {'text': 'tool-tip'})
|
||||
selector: '[tool-tip]', properties: const {'text': 'tool-tip'})
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [],
|
||||
'annotations': const [
|
||||
const Decorator(
|
||||
selector: '[tool-tip]', bind: const {'text': 'tool-tip'})
|
||||
selector: '[tool-tip]', properties: const {'text': 'tool-tip'})
|
||||
]
|
||||
})
|
||||
..registerSetters({'text': (o, String v) => o.text = v});
|
||||
|
|
|
@ -14,13 +14,13 @@ void initReflector(reflector) {
|
|||
'annotations': const [
|
||||
const Component(
|
||||
componentServices: const [SaladComponent],
|
||||
bind: const {'menu': 'menu'})
|
||||
properties: const {'menu': 'menu'})
|
||||
]
|
||||
})
|
||||
..registerType(SaladComponent, {
|
||||
'factory': () => new SaladComponent(),
|
||||
'parameters': const [],
|
||||
'annotations': const [const Component(bind: const {'menu': 'menu'})]
|
||||
'annotations': const [const Component(properties: const {'menu': 'menu'})]
|
||||
})
|
||||
..registerSetters({'menu': (o, String v) => o.menu = v});
|
||||
}
|
||||
|
|
|
@ -14,12 +14,12 @@ void initReflector(reflector) {
|
|||
'annotations': const [
|
||||
const Component(
|
||||
componentServices: const [SaladComponent],
|
||||
bind: const {'menu': 'menu'})
|
||||
properties: const {'menu': 'menu'})
|
||||
]
|
||||
})
|
||||
..registerType(SaladComponent, {
|
||||
'factory': () => new SaladComponent(),
|
||||
'parameters': const [],
|
||||
'annotations': const [const Component(bind: const {'menu': 'menu'})]
|
||||
'annotations': const [const Component(properties: const {'menu': 'menu'})]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [],
|
||||
'annotations': const [
|
||||
const Component(
|
||||
selector: '[soup]', services: const [dep.DependencyComponent])
|
||||
selector: '[soup]', injectables: const [dep.DependencyComponent])
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -15,7 +15,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [],
|
||||
'annotations': const [
|
||||
const Component(
|
||||
selector: '[soup]', services: const [dep.DependencyComponent])
|
||||
selector: '[soup]', injectables: const [dep.DependencyComponent])
|
||||
]
|
||||
});
|
||||
i0.initReflector(reflector);
|
||||
|
|
|
@ -91,8 +91,8 @@ void allTests() {
|
|||
inputs: {
|
||||
'a|web/index.dart': 'two_annotations_files/index.dart',
|
||||
'a|web/bar.dart': 'two_annotations_files/bar.dart',
|
||||
'angular2|lib/src/core/annotations/template.dart':
|
||||
'../../../lib/src/core/annotations/template.dart'
|
||||
'angular2|lib/src/core/annotations/view.dart':
|
||||
'../../../lib/src/core/annotations/view.dart'
|
||||
},
|
||||
outputs: {
|
||||
'a|web/bar.ng_deps.dart':
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
library bar;
|
||||
|
||||
import 'package:angular2/src/core/annotations/annotations.dart';
|
||||
import 'package:angular2/src/core/annotations/template.dart';
|
||||
import 'package:angular2/src/core/annotations/view.dart';
|
||||
|
||||
@Component(selector: '[soup]')
|
||||
@Template(inline: 'Salad')
|
||||
@View(template: 'Salad')
|
||||
class MyComponent {
|
||||
MyComponent();
|
||||
}
|
||||
|
|
|
@ -2,8 +2,8 @@ library bar.ng_deps.dart;
|
|||
|
||||
import 'bar.dart';
|
||||
import 'package:angular2/src/core/annotations/annotations.dart';
|
||||
import 'package:angular2/src/core/annotations/template.dart';
|
||||
import 'package:angular2/src/core/annotations/template.ng_deps.dart' as i0;
|
||||
import 'package:angular2/src/core/annotations/view.dart';
|
||||
import 'package:angular2/src/core/annotations/view.ng_deps.dart' as i0;
|
||||
import 'package:angular2/src/core/annotations/annotations.ng_deps.dart' as i1;
|
||||
|
||||
bool _visited = false;
|
||||
|
@ -16,7 +16,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [],
|
||||
'annotations': const [
|
||||
const Component(selector: '[soup]'),
|
||||
const Template(inline: 'Salad')
|
||||
const View(template: 'Salad')
|
||||
]
|
||||
});
|
||||
i0.initReflector(reflector);
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.hello_world.index_common_dart.ng_deps.dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(inline: '{{greeting}}')
|
||||
const View(template: '{{greeting}}')
|
||||
]
|
||||
})
|
||||
..registerGetters({'greeting': (o) => o.greeting})
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.hello_world.index_common_dart.ng_deps.dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(inline: '{{greeting}}')
|
||||
const View(template: '{{greeting}}')
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.hello_world.index_common_dart.ng_deps.dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(inline: '<button (click)=\"action()\">go</button>')
|
||||
const View(template: '<button (click)=\"action()\">go</button>')
|
||||
]
|
||||
})
|
||||
..registerMethods(
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.hello_world.index_common_dart.ng_deps.dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(inline: '<button (click)=\"action()\">go</button>')
|
||||
const View(template: '<button (click)=\"action()\">go</button>')
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.src.hello_world.index_common_dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(url: 'template.html')
|
||||
const View(templateUrl: 'template.html')
|
||||
]
|
||||
})
|
||||
..registerGetters({'greeting': (o) => o.greeting})
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.src.hello_world.index_common_dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(url: 'template.html')
|
||||
const View(templateUrl: 'template.html')
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.src.hello_world.index_common_dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(url: 'template.html')
|
||||
const View(templateUrl: 'template.html')
|
||||
]
|
||||
})
|
||||
..registerMethods(
|
||||
|
|
|
@ -2,7 +2,7 @@ library examples.src.hello_world.index_common_dart;
|
|||
|
||||
import 'hello.dart';
|
||||
import 'package:angular2/angular2.dart'
|
||||
show bootstrap, Component, Decorator, Template, NgElement;
|
||||
show bootstrap, Component, Decorator, View, NgElement;
|
||||
|
||||
bool _visited = false;
|
||||
void initReflector(reflector) {
|
||||
|
@ -14,7 +14,7 @@ void initReflector(reflector) {
|
|||
'parameters': const [const []],
|
||||
'annotations': const [
|
||||
const Component(selector: 'hello-app'),
|
||||
const Template(url: 'template.html')
|
||||
const View(templateUrl: 'template.html')
|
||||
]
|
||||
});
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@ import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_meta
|
|||
|
||||
import {Component} from 'angular2/src/core/annotations/annotations';
|
||||
import {Decorator} from 'angular2/src/core/annotations/annotations';
|
||||
import {Template} from 'angular2/src/core/annotations/template';
|
||||
import {View} from 'angular2/src/core/annotations/view';
|
||||
import {TemplateLoader} from 'angular2/src/render/dom/compiler/template_loader';
|
||||
import {TemplateResolver} from 'angular2/src/core/compiler/template_resolver';
|
||||
import {UrlResolver} from 'angular2/src/services/url_resolver';
|
||||
|
@ -38,31 +38,31 @@ function setupReflector() {
|
|||
reflector.registerType(Dir0, {
|
||||
"factory": () => new Dir0(),
|
||||
"parameters": [],
|
||||
"annotations" : [new Decorator({selector: '[dir0]', bind: {'prop': 'attr0'}})]
|
||||
"annotations" : [new Decorator({selector: '[dir0]', properties: {'prop': 'attr0'}})]
|
||||
});
|
||||
|
||||
reflector.registerType(Dir1, {
|
||||
"factory": (dir0) => new Dir1(dir0),
|
||||
"parameters": [[Dir0]],
|
||||
"annotations" : [new Decorator({selector: '[dir1]', bind: {'prop': 'attr1'}})]
|
||||
"annotations" : [new Decorator({selector: '[dir1]', properties: {'prop': 'attr1'}})]
|
||||
});
|
||||
|
||||
reflector.registerType(Dir2, {
|
||||
"factory": (dir1) => new Dir2(dir1),
|
||||
"parameters": [[Dir1]],
|
||||
"annotations" : [new Decorator({selector: '[dir2]', bind: {'prop': 'attr2'}})]
|
||||
"annotations" : [new Decorator({selector: '[dir2]', properties: {'prop': 'attr2'}})]
|
||||
});
|
||||
|
||||
reflector.registerType(Dir3, {
|
||||
"factory": (dir2) => new Dir3(dir2),
|
||||
"parameters": [[Dir2]],
|
||||
"annotations" : [new Decorator({selector: '[dir3]', bind: {'prop': 'attr3'}})]
|
||||
"annotations" : [new Decorator({selector: '[dir3]', properties: {'prop': 'attr3'}})]
|
||||
});
|
||||
|
||||
reflector.registerType(Dir4, {
|
||||
"factory": (dir3) => new Dir4(dir3),
|
||||
"parameters": [[Dir3]],
|
||||
"annotations" : [new Decorator({selector: '[dir4]', bind: {'prop': 'attr4'}})]
|
||||
"annotations" : [new Decorator({selector: '[dir4]', properties: {'prop': 'attr4'}})]
|
||||
});
|
||||
|
||||
reflector.registerGetters({
|
||||
|
@ -147,7 +147,7 @@ function createTemplateHtml(templateId, repeatCount) {
|
|||
|
||||
@Decorator({
|
||||
selector: '[dir0]',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'attr0'
|
||||
}
|
||||
})
|
||||
|
@ -155,7 +155,7 @@ class Dir0 {}
|
|||
|
||||
@Decorator({
|
||||
selector: '[dir1]',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'attr1'
|
||||
}
|
||||
})
|
||||
|
@ -165,7 +165,7 @@ class Dir1 {
|
|||
|
||||
@Decorator({
|
||||
selector: '[dir2]',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'attr2'
|
||||
}
|
||||
})
|
||||
|
@ -175,7 +175,7 @@ class Dir2 {
|
|||
|
||||
@Decorator({
|
||||
selector: '[dir3]',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'attr3'
|
||||
}
|
||||
})
|
||||
|
@ -185,7 +185,7 @@ class Dir3 {
|
|||
|
||||
@Decorator({
|
||||
selector: '[dir4]',
|
||||
bind: {
|
||||
properties: {
|
||||
'prop': 'attr4'
|
||||
}
|
||||
})
|
||||
|
@ -197,20 +197,20 @@ class Dir4 {
|
|||
class BenchmarkComponent {}
|
||||
|
||||
class FakeTemplateResolver extends TemplateResolver {
|
||||
_template: Template;
|
||||
_template: View;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
||||
setTemplateHtml(html: string) {
|
||||
this._template = new Template({
|
||||
inline: html,
|
||||
this._template = new View({
|
||||
template: html,
|
||||
directives: [Dir0, Dir1, Dir2, Dir3, Dir4]
|
||||
});
|
||||
}
|
||||
|
||||
resolve(component: Type): Template {
|
||||
resolve(component: Type): View {
|
||||
return this._template;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,7 +2,7 @@ import {Parser, Lexer, ChangeDetector, ChangeDetection, jitChangeDetection}
|
|||
from 'angular2/change_detection';
|
||||
import {ExceptionHandler} from 'angular2/src/core/exception_handler';
|
||||
|
||||
import {bootstrap, Component, Viewport, Template, ViewContainer, Compiler, NgElement, Decorator} from 'angular2/angular2';
|
||||
import {bootstrap, Component, Viewport, View, ViewContainer, Compiler, NgElement, Decorator} from 'angular2/angular2';
|
||||
|
||||
import {CompilerCache} from 'angular2/src/core/compiler/compiler';
|
||||
import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
|
||||
|
@ -58,9 +58,9 @@ function setupReflector() {
|
|||
selector: 'app'
|
||||
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [LargetableComponent],
|
||||
inline: `<largetable [data]='data' [benchmarkType]='benchmarkType'></largetable>`
|
||||
template: `<largetable [data]='data' [benchmarkType]='benchmarkType'></largetable>`
|
||||
})]
|
||||
});
|
||||
|
||||
|
@ -71,14 +71,14 @@ function setupReflector() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'largetable',
|
||||
bind: {
|
||||
properties: {
|
||||
'data': 'data',
|
||||
'benchmarkType': 'benchmarktype'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [For, Switch, SwitchWhen, SwitchDefault],
|
||||
inline: `
|
||||
template: `
|
||||
<table [switch]="benchmarkType">
|
||||
<tbody template="switch-when 'interpolation'">
|
||||
<tr template="for #row of data">
|
||||
|
@ -118,7 +118,7 @@ function setupReflector() {
|
|||
'parameters': [[ViewContainer]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[if]',
|
||||
bind: {
|
||||
properties: {
|
||||
'condition': 'if'
|
||||
}
|
||||
})]
|
||||
|
@ -129,7 +129,7 @@ function setupReflector() {
|
|||
'parameters': [[ViewContainer]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[for]',
|
||||
bind: {
|
||||
properties: {
|
||||
'iterableChanges': 'of | iterableDiff'
|
||||
}
|
||||
})]
|
||||
|
@ -140,7 +140,7 @@ function setupReflector() {
|
|||
'parameters': [],
|
||||
'annotations' : [new Decorator({
|
||||
selector: '[switch]',
|
||||
bind: {
|
||||
properties: {
|
||||
'value': 'switch'
|
||||
}
|
||||
})]
|
||||
|
@ -151,7 +151,7 @@ function setupReflector() {
|
|||
'parameters': [[ViewContainer],[Switch, new Parent()]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[switch-when]',
|
||||
bind: {
|
||||
properties: {
|
||||
'when': 'switch-when'
|
||||
}
|
||||
})]
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {int, isPresent} from 'angular2/src/facade/lang';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {getIntParameter, bindAction} from 'angular2/src/test_lib/benchmark_util';
|
||||
import {bootstrap, Component, Viewport, Template, ViewContainer, Compiler}
|
||||
import {bootstrap, Component, Viewport, View, ViewContainer, Compiler}
|
||||
from 'angular2/angular2';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {ListWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -84,9 +84,9 @@ export function setupReflectorForApp() {
|
|||
'parameters': [],
|
||||
'annotations': [
|
||||
new Component({selector: 'scroll-app'}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [ScrollAreaComponent, If, For],
|
||||
inline: `
|
||||
template: `
|
||||
<div>
|
||||
<div style="display: flex">
|
||||
<scroll-area id="testArea"></scroll-area>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {int} from 'angular2/src/facade/lang';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {getIntParameter, bindAction} from 'angular2/src/test_lib/benchmark_util';
|
||||
import {bootstrap, Component, Viewport, Template, ViewContainer, Compiler}
|
||||
import {bootstrap, Component, Viewport, View, ViewContainer, Compiler}
|
||||
from 'angular2/angular2';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -103,14 +103,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'company-name',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'company': 'company'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [],
|
||||
inline: `<div [style]="style">{{company.name}}</div>`
|
||||
template: `<div [style]="style">{{company.name}}</div>`
|
||||
})
|
||||
]
|
||||
});
|
||||
|
@ -121,14 +121,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'opportunity-name',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'opportunity': 'opportunity'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [],
|
||||
inline: `<div [style]="style">{{opportunity.name}}</div>`
|
||||
template: `<div [style]="style">{{opportunity.name}}</div>`
|
||||
})
|
||||
]
|
||||
});
|
||||
|
@ -139,14 +139,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'offering-name',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'offering': 'offering'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [],
|
||||
inline: `<div [style]="style">{{offering.name}}</div>`
|
||||
template: `<div [style]="style">{{offering.name}}</div>`
|
||||
})
|
||||
]
|
||||
});
|
||||
|
@ -157,14 +157,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'stage-buttons',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'offering': 'offering'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [For],
|
||||
inline: `
|
||||
template: `
|
||||
<div [style]="style">
|
||||
<button template="for #stage of stages"
|
||||
[disabled]="stage.isDisabled"
|
||||
|
@ -183,14 +183,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'account-cell',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'account': 'account'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [],
|
||||
inline: `
|
||||
template: `
|
||||
<div [style]="style">
|
||||
<a href="/account/{{account.accountId}}">
|
||||
{{account.accountId}}
|
||||
|
@ -206,14 +206,14 @@ export function setupReflectorForCells() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'formatted-cell',
|
||||
bind: {
|
||||
properties: {
|
||||
'width': 'cell-width',
|
||||
'value': 'value'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [],
|
||||
inline: `<div [style]="style">{{formattedValue}}</div>`
|
||||
template: `<div [style]="style">{{formattedValue}}</div>`
|
||||
})
|
||||
]
|
||||
});
|
||||
|
|
|
@ -6,7 +6,7 @@ import {Parser, Lexer, ChangeDetector, ChangeDetection}
|
|||
from 'angular2/change_detection';
|
||||
import {ExceptionHandler} from 'angular2/src/core/exception_handler';
|
||||
import {
|
||||
bootstrap, Component, Viewport, Template, ViewContainer, Compiler, onChange, NgElement, Decorator
|
||||
bootstrap, Component, Viewport, View, ViewContainer, Compiler, onChange, NgElement, Decorator
|
||||
} from 'angular2/angular2';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {CompilerCache} from 'angular2/src/core/compiler/compiler';
|
||||
|
@ -174,7 +174,7 @@ export function setupReflectorForAngular() {
|
|||
'parameters': [[ViewContainer]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[if]',
|
||||
bind: {
|
||||
properties: {
|
||||
'condition': 'if'
|
||||
}
|
||||
})]
|
||||
|
@ -185,7 +185,7 @@ export function setupReflectorForAngular() {
|
|||
'parameters': [[ViewContainer]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[for]',
|
||||
bind: {
|
||||
properties: {
|
||||
'iterableChanges': 'of | iterableDiff'
|
||||
}
|
||||
})]
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {int, FINAL} from 'angular2/src/facade/lang';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {getIntParameter, bindAction} from 'angular2/src/test_lib/benchmark_util';
|
||||
import {Component, Viewport, Template, ViewContainer, Compiler}
|
||||
import {Component, Viewport, View, ViewContainer, Compiler}
|
||||
from 'angular2/angular2';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -68,9 +68,9 @@ export function setupReflectorForScrollArea() {
|
|||
new Component({
|
||||
selector: 'scroll-area',
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [ScrollItemComponent, For],
|
||||
inline: `
|
||||
template: `
|
||||
<div>
|
||||
<div id="scrollDiv"
|
||||
[style]="scrollDivStyle"
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {int} from 'angular2/src/facade/lang';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {Component, Viewport, Template, ViewContainer, Compiler}
|
||||
import {Component, Viewport, View, ViewContainer, Compiler}
|
||||
from 'angular2/angular2';
|
||||
import {PromiseWrapper} from 'angular2/src/facade/async';
|
||||
import {ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
|
||||
|
@ -51,11 +51,11 @@ export function setupReflectorForScrollItem() {
|
|||
'annotations': [
|
||||
new Component({
|
||||
selector: 'scroll-item',
|
||||
bind: {
|
||||
properties: {
|
||||
'offering': 'offering'
|
||||
}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [
|
||||
CompanyNameComponent,
|
||||
OpportunityNameComponent,
|
||||
|
@ -64,7 +64,7 @@ export function setupReflectorForScrollItem() {
|
|||
AccountCellComponent,
|
||||
FormattedCellComponent
|
||||
],
|
||||
inline: `
|
||||
template: `
|
||||
<div class="row" [style]="itemStyle">
|
||||
<company-name [company]="offering.company"
|
||||
[cell-width]="companyNameWidth">
|
||||
|
|
|
@ -2,7 +2,7 @@ import {Parser, Lexer, ChangeDetector, ChangeDetection, jitChangeDetection}
|
|||
from 'angular2/change_detection';
|
||||
import {ExceptionHandler} from 'angular2/src/core/exception_handler';
|
||||
|
||||
import {bootstrap, Component, Viewport, Template, ViewContainer, Compiler, NgElement, Decorator} from 'angular2/angular2';
|
||||
import {bootstrap, Component, Viewport, View, ViewContainer, Compiler, NgElement, Decorator} from 'angular2/angular2';
|
||||
|
||||
import {CompilerCache} from 'angular2/src/core/compiler/compiler';
|
||||
import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
|
||||
|
@ -49,9 +49,9 @@ function setupReflector() {
|
|||
'parameters': [],
|
||||
'annotations' : [
|
||||
new Component({selector: 'app'}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [TreeComponent],
|
||||
inline: `<tree [data]='initData'></tree>`
|
||||
template: `<tree [data]='initData'></tree>`
|
||||
})]
|
||||
});
|
||||
|
||||
|
@ -61,11 +61,11 @@ function setupReflector() {
|
|||
'annotations' : [
|
||||
new Component({
|
||||
selector: 'tree',
|
||||
bind: {'data': 'data'}
|
||||
properties: {'data': 'data'}
|
||||
}),
|
||||
new Template({
|
||||
new View({
|
||||
directives: [TreeComponent, If],
|
||||
inline: `<span> {{data.value}} <span template='if data.right != null'><tree [data]='data.right'></tree></span><span template='if data.left != null'><tree [data]='data.left'></tree></span></span>`
|
||||
template: `<span> {{data.value}} <span template='if data.right != null'><tree [data]='data.right'></tree></span><span template='if data.left != null'><tree [data]='data.left'></tree></span></span>`
|
||||
})]
|
||||
});
|
||||
|
||||
|
@ -74,7 +74,7 @@ function setupReflector() {
|
|||
'parameters': [[ViewContainer]],
|
||||
'annotations' : [new Viewport({
|
||||
selector: '[if]',
|
||||
bind: {
|
||||
properties: {
|
||||
'condition': 'if'
|
||||
}
|
||||
})]
|
||||
|
|
|
@ -35,7 +35,7 @@
|
|||
this[treeName] = null;
|
||||
}
|
||||
},
|
||||
bind: {
|
||||
properties: {
|
||||
data: 'dataChanged'
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import {bootstrap, Component, Decorator, Template, If, For, EventEmitter} from 'angular2/angular2';
|
||||
import {bootstrap, Component, Decorator, View, If, For, EventEmitter} from 'angular2/angular2';
|
||||
import {FormBuilder, Validators, FormDirectives, ControlGroup} from 'angular2/forms';
|
||||
|
||||
// HeaderFields renders the bound header control group. It can used as follows:
|
||||
|
@ -8,12 +8,12 @@ import {FormBuilder, Validators, FormDirectives, ControlGroup} from 'angular2/fo
|
|||
// This component is self-contained and can be tested in isolation.
|
||||
@Component({
|
||||
selector: 'survey-header',
|
||||
bind: {
|
||||
properties: {
|
||||
"header" : "header"
|
||||
}
|
||||
})
|
||||
@Template({
|
||||
inline: `
|
||||
@View({
|
||||
template: `
|
||||
<div [control-group]="header">
|
||||
<div>
|
||||
<label>Title:</label> <br/>
|
||||
|
@ -53,13 +53,13 @@ class HeaderFields {
|
|||
// This component is self-contained and can be tested in isolation.
|
||||
@Component({
|
||||
selector: 'survey-question',
|
||||
bind: {
|
||||
properties: {
|
||||
"question" : "question",
|
||||
"index" : "index"
|
||||
}
|
||||
})
|
||||
@Template({
|
||||
inline: `
|
||||
@View({
|
||||
template: `
|
||||
<h2>Question #{{index}}</h2>
|
||||
|
||||
<button (click)="deleteQuestion()">Delete</button>
|
||||
|
@ -118,10 +118,10 @@ class SurveyQuestion {
|
|||
// SurveyBuilder is a form that allows you to create a survey.
|
||||
@Component({
|
||||
selector: 'survey-builder-app',
|
||||
services: [FormBuilder]
|
||||
injectables: [FormBuilder]
|
||||
})
|
||||
@Template({
|
||||
inline: `
|
||||
@View({
|
||||
template: `
|
||||
<h1>Create New Survey</h1>
|
||||
|
||||
<div [control-group]="form">
|
||||
|
@ -194,4 +194,4 @@ class SurveyBuilder {
|
|||
|
||||
export function main() {
|
||||
bootstrap(SurveyBuilder);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import {bootstrap, Component, Template} from 'angular2/angular2';
|
||||
import {bootstrap, Component, View} from 'angular2/angular2';
|
||||
import {reflector} from 'angular2/src/reflection/reflection';
|
||||
import {ReflectionCapabilities} from 'angular2/src/reflection/reflection_capabilities';
|
||||
|
||||
@Component({selector: 'gestures-app'})
|
||||
@Template({url: 'template.html'})
|
||||
@View({templateUrl: 'template.html'})
|
||||
class GesturesCmp {
|
||||
swipeDirection: string;
|
||||
pinchScale: number;
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import {bootstrap, Component, Decorator, Template, NgElement} from 'angular2/angular2';
|
||||
import {bootstrap, Component, Decorator, View, NgElement} from 'angular2/angular2';
|
||||
import {Injectable} from 'angular2/di';
|
||||
|
||||
// Angular 2.0 supports 3 basic types of directives:
|
||||
|
@ -16,13 +16,13 @@ import {Injectable} from 'angular2/di';
|
|||
selector: 'hello-app',
|
||||
// These are services that would be created if a class in the component's
|
||||
// template tries to inject them.
|
||||
services: [GreetingService]
|
||||
injectables: [GreetingService]
|
||||
})
|
||||
// The template for the component.
|
||||
@Template({
|
||||
@View({
|
||||
// Expressions in the template (like {{greeting}}) are evaluated in the
|
||||
// context of the HelloCmp class below.
|
||||
inline: `<div class="greeting">{{greeting}} <span red>world</span>!</div>
|
||||
template: `<div class="greeting">{{greeting}} <span red>world</span>!</div>
|
||||
<button class="changeButton" (click)="changeGreeting()">change greeting</button><content></content>`,
|
||||
// All directives used in the template need to be specified. This allows for
|
||||
// modularity (RedDec can only be used in this template)
|
||||
|
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue