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

refactor(compiler): rename decorator directives into directive

Browse Source 
BREAKING CHANGE:
Previously, `Directive` was the abstract base class of several directives.
Now, `Directive` is the former `Decorator`, and `Component` inherits from it.
This commit is contained in:
Tobias Bosch
2015-04-30 13:38:40 -07:00
parent c671706518
commit f75a50c1dd
71 changed files with 384 additions and 438 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/angular2/src/core/annotations/annotations.es6
-1
View File
@@ -5,7 +5,6 @@
export {
Component as ComponentAnnotation,
Decorator as DecoratorAnnotation,
Directive as DirectiveAnnotation,
onDestroy, onChange, onAllChangesDone
} from '../annotations_impl/annotations';
modules/angular2/src/core/annotations_impl/annotations.js
Vendored
+174 -222
View File
@@ -1,4 +1,4 @@
import {ABSTRACT, CONST, normalizeBlank, isPresent} from 'angular2/src/facade/lang';
import {CONST, normalizeBlank, isPresent} from 'angular2/src/facade/lang';
import {ListWrapper, List} from 'angular2/src/facade/collection';
import {Injectable} from 'angular2/di';
import {DEFAULT} from 'angular2/change_detection';
@@ -8,7 +8,7 @@ import {DEFAULT} from 'angular2/change_detection';
/**
* Directives allow you to attach behavior to elements in the DOM.
*
* Directive is an abstract concept, instead use concrete directives: {@link Component}, or {@link Decorator}.
* {@link Directive}s with an embedded view are called {@link Component}s.
*
* A directive consists of a single directive annotation and a controller class. When the directive's `selector` matches
* elements in the DOM, the following steps occur:
@@ -54,7 +54,7 @@ import {DEFAULT} from 'angular2/change_detection';
*
* To inject element-specific special objects, declare the constructor parameter as:
* - `element: ElementRef` to obtain a reference to logical element in the view.
* - `viewContainer: ViewContainerRef` to control child template instantiation, for {@link Decorator} directives only
* - `viewContainer: ViewContainerRef` to control child template instantiation, for {@link Directive} directives only
* - `bindingPropagation: BindingPropagation` to control change detection in a more granular way.
*
* ## Example
@@ -84,7 +84,7 @@ import {DEFAULT} from 'angular2/change_detection';
* class SomeService {
* }
*
* @Decorator({
* @Directive({
* selector: '[dependency]',
* properties: {
* 'id':'dependency'
@@ -103,7 +103,7 @@ import {DEFAULT} from 'angular2/change_detection';
* Here the constructor is declared with no arguments, therefore nothing is injected into `MyDirective`.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor() {
* }
@@ -120,7 +120,7 @@ import {DEFAULT} from 'angular2/change_detection';
* Here, the constructor declares a parameter, `someService`, and injects the `SomeService` type from the parent
* component's injector.
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(someService: SomeService) {
* }
@@ -135,7 +135,7 @@ import {DEFAULT} from 'angular2/change_detection';
* Directives can inject other directives declared on the current element.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(dependency: Dependency) {
* expect(dependency.id).toEqual(3);
@@ -152,7 +152,7 @@ import {DEFAULT} from 'angular2/change_detection';
* the dependency.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(@Parent() dependency: Dependency) {
* expect(dependency.id).toEqual(2);
@@ -169,7 +169,7 @@ import {DEFAULT} from 'angular2/change_detection';
* resolve dependencies for the current element, even if this would satisfy the dependency.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(@Ancestor() dependency: Dependency) {
* expect(dependency.id).toEqual(2);
@@ -191,7 +191,7 @@ import {DEFAULT} from 'angular2/change_detection';
* that uses a {@link ViewContainerRef} such as a `for`, an `if`, or a `switch`.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(@Query(Marker) dependencies:QueryList<Maker>) {
* }
@@ -208,7 +208,7 @@ import {DEFAULT} from 'angular2/change_detection';
* Similar to `@Children` above, but also includes the children of the child elements.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(@QueryDescendents(Marker) dependencies:QueryList<Maker>) {
* }
@@ -224,7 +224,7 @@ import {DEFAULT} from 'angular2/change_detection';
* This explicitly permits the author of a template to treat some of the surrounding directives as optional.
*
* ```
* @Decorator({ selector: '[my-directive]' })
* @Directive({ selector: '[my-directive]' })
* class MyDirective {
* constructor(@Optional() dependency:Dependency) {
* }
@@ -234,9 +234,141 @@ import {DEFAULT} from 'angular2/change_detection';
* This directive would be instantiated with a `Dependency` directive found on the current element. If none can be
* found, the injector supplies `null` instead of throwing an error.
*
* ## Example
*
* Here we use a decorator directive to simply define basic tool-tip behavior.
*
* ```
* @Directive({
* selector: '[tooltip]',
* properties: {
* 'text': 'tooltip'
* },
* hostListeners: {
* 'onmouseenter': 'onMouseEnter()',
* 'onmouseleave': 'onMouseLeave()'
* }
* })
* class Tooltip{
* text:string;
* overlay:Overlay; // NOT YET IMPLEMENTED
* overlayManager:OverlayManager; // NOT YET IMPLEMENTED
*
* constructor(overlayManager:OverlayManager) {
* this.overlay = overlay;
* }
*
* onMouseEnter() {
* // exact signature to be determined
* this.overlay = this.overlayManager.open(text, ...);
* }
*
* onMouseLeave() {
* this.overlay.close();
* this.overlay = null;
* }
* }
* ```
* In our HTML template, we can then add this behavior to a `<div>` or any other element with the `tooltip` selector,
* like so:
*
* ```
* <div tooltip="some text here"></div>
* ```
*
* Directives can also control the instantiation, destruction, and positioning of inline template elements:
*
* A directive uses a {@link ViewContainerRef} to instantiate, insert, move, and destroy views at runtime.
* The {@link ViewContainerRef} is created as a result of `<template>` element, and represents a location in the current view
* where these actions are performed.
*
* Views are always created as children of the current {@link View}, and as siblings of the `<template>` element. Thus a
* directive in a child view cannot inject the directive that created it.
*
* Since directives that create views via ViewContainers are common in Angular, and using the full `<template>` element syntax is wordy, Angular
* also supports a shorthand notation: `<li *foo="bar">` and `<li template="foo: bar">` are equivalent.
*
* Thus,
*
* ```
* <ul>
* <li *foo="bar" title="text"></li>
* </ul>
* ```
*
* Expands in use to:
*
* ```
* <ul>
* <template [foo]="bar">
* <li title="text"></li>
* </template>
* </ul>
* ```
*
* Notice that although the shorthand places `*foo="bar"` within the `<li>` element, the binding for the directive
* controller is correctly instantiated on the `<template>` element rather than the `<li>` element.
*
*
* ## Example
*
* Let's suppose we want to implement the `unless` behavior, to conditionally include a template.
*
* Here is a simple directive that triggers on an `unless` selector:
*
* ```
* @Directive({
* selector: '[unless]',
* properties: {
* 'unless': 'unless'
* }
* })
* export class Unless {
* viewContainer: ViewContainerRef;
* protoViewRef: ProtoViewRef;
* prevCondition: boolean;
*
* constructor(viewContainer: ViewContainerRef, protoViewRef: ProtoViewRef) {
* this.viewContainer = viewContainer;
* this.protoViewRef = protoViewRef;
* this.prevCondition = null;
* }
*
* set unless(newCondition) {
* if (newCondition && (isBlank(this.prevCondition) || !this.prevCondition)) {
* this.prevCondition = true;
* this.viewContainer.clear();
* } else if (!newCondition && (isBlank(this.prevCondition) || this.prevCondition)) {
* this.prevCondition = false;
* this.viewContainer.create(this.protoViewRef);
* }
* }
* }
* ```
*
* We can then use this `unless` selector in a template:
* ```
* <ul>
* <li *unless="expr"></li>
* </ul>
* ```
*
* Once the directive instantiates the child view, the shorthand notation for the template expands and the result is:
*
* ```
* <ul>
* <template [unless]="exp">
* <li></li>
* </template>
* <li></li>
* </ul>
* ```
*
* Note also that although the `<li></li>` template still exists inside the `<template></template>`, the instantiated
* view occurs on the second `<li></li>` which is a sibling to the `<template>` element.
*
* @exportedAs angular2/annotations
*/
@ABSTRACT()
export class Directive extends Injectable {
/**
* The CSS selector that triggers the instantiation of a directive.
@@ -303,7 +435,7 @@ export class Directive extends Injectable {
* with standard Angular syntax. For example:
*
* ```
* @Decorator({
* @Directive({
* selector: '[tooltip]',
* properties: {
* 'text': 'tooltip'
@@ -339,7 +471,7 @@ export class Directive extends Injectable {
* See {@link Pipe} and {@link keyValDiff} documentation for more details.
*
* ```
* @Decorator({
* @Directive({
* selector: '[class-set]',
* properties: {
* 'classChanges': 'classSet | keyValDiff'
@@ -423,14 +555,14 @@ export class Directive extends Injectable {
* You would define the event binding as follows:
*
* ```
* @Decorator({
* @Directive({
* selector: 'input',
* hostListeners: {
* 'change': 'onChange($event)',
* 'window:resize': 'onResize($event)'
* }
* })
* class InputDecorator {
* class InputDirective {
* onChange(event:Event) {
* }
* onResize(event:Event) {
@@ -438,7 +570,7 @@ export class Directive extends Injectable {
* }
* ```
*
* Here the `onChange` method of `InputDecorator` is invoked whenever the DOM element fires the 'change' event.
* Here the `onChange` method of `InputDirective` is invoked whenever the DOM element fires the 'change' event.
*
*/
hostListeners:any; // StringMap
@@ -450,13 +582,13 @@ export class Directive extends Injectable {
* ## Syntax
*
* ```
* @Decorator({
* @Directive({
* selector: 'input',
* hostProperties: {
* 'value': 'value'
* }
* })
* class InputDecorator {
* class InputDirective {
* value:string;
* }
*
@@ -473,6 +605,12 @@ export class Directive extends Injectable {
*/
lifecycle:List; //List<LifecycleEvent>
/**
* If set to true the compiler does not compile the children of this directive.
*/
//TODO(vsavkin): This would better fall under the Macro directive concept.
compileChildren: boolean;
@CONST()
constructor({
selector,
@@ -480,14 +618,16 @@ export class Directive extends Injectable {
events,
hostListeners,
hostProperties,
lifecycle
lifecycle,
compileChildren = true,
}:{
selector:string,
properties:any,
events:List,
hostListeners: any,
hostProperties: any,
lifecycle:List
lifecycle:List,
compileChildren:boolean
}={})
{
super();
@@ -497,6 +637,7 @@ export class Directive extends Injectable {
this.hostListeners = hostListeners;
this.hostProperties = hostProperties;
this.lifecycle = lifecycle;
this.compileChildren = compileChildren;
}
/**
@@ -658,7 +799,8 @@ export class Component extends Directive {
hostProperties,
injectables,
lifecycle,
changeDetection = DEFAULT
changeDetection = DEFAULT,
compileChildren = true,
}:{
selector:string,
properties:Object,
@@ -667,200 +809,7 @@ export class Component extends Directive {
hostProperties:any,
injectables:List,
lifecycle:List,
changeDetection:string
}={})
{
super({
selector: selector,
properties: properties,
events: events,
hostListeners: hostListeners,
hostProperties: hostProperties,
lifecycle: lifecycle
});
this.changeDetection = changeDetection;
this.injectables = injectables;
}
}
/**
* Directive that attaches behavior to DOM elements.
*
* A decorator directive attaches behavior to a DOM element in a composable manner.
* (see: http://en.wikipedia.org/wiki/Composition_over_inheritance)
*
* Decorators:
* - are simplest form of {@link Directive}s.
* - are best used as a composition pattern ()
*
* Decorators differ from {@link Component}s in that they:
* - can have multiple decorators per element
* - do not create their own evaluation context
* - do not have a template (and therefor do not create Shadow DOM)
*
*
* ## Example
*
* Here we use a decorator directive to simply define basic tool-tip behavior.
*
* ```
* @Decorator({
* selector: '[tooltip]',
* properties: {
* 'text': 'tooltip'
* },
* hostListeners: {
* 'onmouseenter': 'onMouseEnter()',
* 'onmouseleave': 'onMouseLeave()'
* }
* })
* class Tooltip{
* text:string;
* overlay:Overlay; // NOT YET IMPLEMENTED
* overlayManager:OverlayManager; // NOT YET IMPLEMENTED
*
* constructor(overlayManager:OverlayManager) {
* this.overlay = overlay;
* }
*
* onMouseEnter() {
* // exact signature to be determined
* this.overlay = this.overlayManager.open(text, ...);
* }
*
* onMouseLeave() {
* this.overlay.close();
* this.overlay = null;
* }
* }
* ```
* In our HTML template, we can then add this behavior to a `<div>` or any other element with the `tooltip` selector,
* like so:
*
* ```
* <div tooltip="some text here"></div>
* ```
*
* Decorators can also control the instantiation, destruction, and positioning of inline template elements:
*
* A directive uses a {@link ViewContainerRef} to instantiate, insert, move, and destroy views at runtime.
* The {@link ViewContainerRef} is created as a result of `<template>` element, and represents a location in the current view
* where these actions are performed.
*
* Views are always created as children of the current {@link View}, and as siblings of the `<template>` element. Thus a
* directive in a child view cannot inject the directive that created it.
*
* Since directives that create views via ViewContainers are common in Angular, and using the full `<template>` element syntax is wordy, Angular
* also supports a shorthand notation: `<li *foo="bar">` and `<li template="foo: bar">` are equivalent.
*
* Thus,
*
* ```
* <ul>
* <li *foo="bar" title="text"></li>
* </ul>
* ```
*
* Expands in use to:
*
* ```
* <ul>
* <template [foo]="bar">
* <li title="text"></li>
* </template>
* </ul>
* ```
*
* Notice that although the shorthand places `*foo="bar"` within the `<li>` element, the binding for the directive
* controller is correctly instantiated on the `<template>` element rather than the `<li>` element.
*
*
* ## Example
*
* Let's suppose we want to implement the `unless` behavior, to conditionally include a template.
*
* Here is a simple directive that triggers on an `unless` selector:
*
* ```
* @Directive({
* selector: '[unless]',
* properties: {
* 'unless': 'unless'
* }
* })
* export class Unless {
* viewContainer: ViewContainerRef;
* protoViewRef: ProtoViewRef;
* prevCondition: boolean;
*
* constructor(viewContainer: ViewContainerRef, protoViewRef: ProtoViewRef) {
* this.viewContainer = viewContainer;
* this.protoViewRef = protoViewRef;
* this.prevCondition = null;
* }
*
* set unless(newCondition) {
* if (newCondition && (isBlank(this.prevCondition) || !this.prevCondition)) {
* this.prevCondition = true;
* this.viewContainer.clear();
* } else if (!newCondition && (isBlank(this.prevCondition) || this.prevCondition)) {
* this.prevCondition = false;
* this.viewContainer.create(this.protoViewRef);
* }
* }
* }
* ```
*
* We can then use this `unless` selector in a template:
* ```
* <ul>
* <li *unless="expr"></li>
* </ul>
* ```
*
* Once the directive instantiates the child view, the shorthand notation for the template expands and the result is:
*
* ```
* <ul>
* <template [unless]="exp">
* <li></li>
* </template>
* <li></li>
* </ul>
* ```
*
* Note also that although the `<li></li>` template still exists inside the `<template></template>`, the instantiated
* view occurs on the second `<li></li>` which is a sibling to the `<template>` element.
*
*
* @exportedAs angular2/annotations
*/
export class Decorator extends Directive {
/**
* If set to true the compiler does not compile the children of this directive.
*/
//TODO(vsavkin): This would better fall under the Macro directive concept.
compileChildren: boolean;
@CONST()
constructor({
selector,
properties,
events,
hostListeners,
hostProperties,
lifecycle,
compileChildren = true,
}:{
selector:string,
properties:any,
events:List,
hostListeners:any,
hostProperties:any,
lifecycle:List,
changeDetection:string,
compileChildren:boolean
}={})
{
@@ -870,9 +819,12 @@ export class Decorator extends Directive {
events: events,
hostListeners: hostListeners,
hostProperties: hostProperties,
lifecycle: lifecycle
lifecycle: lifecycle,
compileChildren: compileChildren
});
this.compileChildren = compileChildren;
this.changeDetection = changeDetection;
this.injectables = injectables;
}
}
@@ -885,7 +837,7 @@ export class Decorator extends Directive {
* ## Example
*
* ```
* @Decorator({
* @Directive({
* ...,
* lifecycle: [onDestroy]
* })
@@ -911,7 +863,7 @@ export const onDestroy = "onDestroy";
* ## Example:
*
* ```
* @Decorator({
* @Directive({
* selector: '[class-set]',
* properties: {
* 'propA': 'propA'
@@ -943,7 +895,7 @@ export const onChange = "onChange";
* ## Example:
*
* ```
* @Decorator({
* @Directive({
* selector: '[class-set]',
* lifecycle: [onAllChangesDone]
* })
modules/angular2/src/core/annotations_impl/di.js
Vendored
+2 -2
View File
@@ -17,10 +17,10 @@ import {DependencyAnnotation} from 'angular2/di';
* A decorator can inject string literal `text` like so:
*
* ```javascript
* @Decorator({
* @Directive({
* selector: `input'
* })
* class InputDecorator {
* class InputDirective {
* constructor(@Attribute('type') type) {
* // type would be `text` in this example
* }
modules/angular2/src/core/annotations_impl/visibility.js
Vendored
+4 -4
View File
@@ -9,7 +9,7 @@ import {DependencyAnnotation} from 'angular2/di';
* Here is a simple directive that retrieves a dependency from its parent element.
*
* ```
* @Decorator({
* @Directive({
* selector: '[dependency]',
* properties: {
* 'id':'dependency'
@@ -20,7 +20,7 @@ import {DependencyAnnotation} from 'angular2/di';
* }
*
*
* @Decorator({
* @Directive({
* selector: '[my-directive]'
* })
* class Dependency {
@@ -60,7 +60,7 @@ export class Parent extends DependencyAnnotation {
* Here is a simple directive that retrieves a dependency from an ancestor element.
*
* ```
* @Decorator({
* @Directive({
* selector: '[dependency]',
* properties: {
* 'id':'dependency'
@@ -71,7 +71,7 @@ export class Parent extends DependencyAnnotation {
* }
*
*
* @Decorator({
* @Directive({
* selector: '[my-directive]'
* })
* class Dependency {
modules/angular2/src/core/compiler/compiler.js
Vendored
+4 -5
View File
@@ -4,7 +4,7 @@ import {Promise, PromiseWrapper} from 'angular2/src/facade/async';
import {List, ListWrapper, Map, MapWrapper} from 'angular2/src/facade/collection';
import {DirectiveMetadataReader} from './directive_metadata_reader';
import {Component, Decorator} from '../annotations_impl/annotations';
import {Component, Directive} from '../annotations_impl/annotations';
import {AppProtoView} from './view';
import {ProtoViewRef} from './view_ref';
import {DirectiveBinding} from './element_injector';
@@ -230,12 +230,11 @@ export class Compiler {
static buildRenderDirective(directiveBinding):renderApi.DirectiveMetadata {
var ann = directiveBinding.annotation;
var renderType;
var compileChildren = true;
var compileChildren = ann.compileChildren;
if (ann instanceof Component) {
renderType = renderApi.DirectiveMetadata.COMPONENT_TYPE;
} else if (ann instanceof Decorator) {
renderType = renderApi.DirectiveMetadata.DECORATOR_TYPE;
compileChildren = ann.compileChildren;
} else {
renderType = renderApi.DirectiveMetadata.DIRECTIVE_TYPE;
}
var readAttributes = [];
ListWrapper.forEach(directiveBinding.dependencies, (dep) => {
modules/angular2/src/core/decorators/decorators.es6
+2 -2
View File
@@ -1,6 +1,6 @@
import {
ComponentAnnotation,
DecoratorAnnotation
DirectiveAnnotation
} from '../annotations/annotations';
import {ViewAnnotation} from '../annotations/view';
import {AncestorAnnotation, ParentAnnotation} from '../annotations/visibility';
@@ -23,7 +23,7 @@ function makeDecorator(annotationCls) {
/* from annotations */
export var Component = makeDecorator(ComponentAnnotation);
export var Decorator = makeDecorator(DecoratorAnnotation);
export var Decorator = makeDecorator(DirectiveAnnotation);
/* from di */
export var Attribute = makeDecorator(AttributeAnnotation);
modules/angular2/src/directives/class.js
Vendored
+2 -2
View File
@@ -1,9 +1,9 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {isPresent} from 'angular2/src/facade/lang';
import {DOM} from 'angular2/src/dom/dom_adapter';
import {ElementRef} from 'angular2/src/core/compiler/element_ref';
@Decorator({
@Directive({
selector: '[class]',
properties: {
'iterableChanges': 'class | keyValDiff'
modules/angular2/src/directives/for.js
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {ViewRef, ProtoViewRef} from 'angular2/src/core/compiler/view_ref';
import {isPresent, isBlank} from 'angular2/src/facade/lang';
@@ -36,7 +36,7 @@ import {ListWrapper} from 'angular2/src/facade/collection';
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[for][of]',
properties: {
'iterableChanges': 'of | iterableDiff'
modules/angular2/src/directives/if.js
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {ProtoViewRef} from 'angular2/src/core/compiler/view_ref';
import {isBlank} from 'angular2/src/facade/lang';
@@ -26,7 +26,7 @@ import {isBlank} from 'angular2/src/facade/lang';
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[if]',
properties: {
'condition': 'if'
modules/angular2/src/directives/non_bindable.js
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
/**
* The `NonBindable` directive tells Angular not to compile or bind the contents of the current
@@ -15,7 +15,7 @@ import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[non-bindable]',
compileChildren: false
})
modules/angular2/src/directives/switch.js
Vendored
+4 -4
View File
@@ -1,4 +1,4 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref';
import {ProtoViewRef} from 'angular2/src/core/compiler/view_ref';
import {isPresent, isBlank, normalizeBlank} from 'angular2/src/facade/lang';
@@ -50,7 +50,7 @@ class SwitchView {
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[switch]',
properties: {
'value': 'switch'
@@ -164,7 +164,7 @@ export class Switch {
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[switch-when]',
properties: {
'when' : 'switch-when'
@@ -206,7 +206,7 @@ export class SwitchWhen {
*
* @exportedAs angular2/directives
*/
@Decorator({
@Directive({
selector: '[switch-default]'
})
export class SwitchDefault {
modules/angular2/src/forms/directives.js
Vendored
+5 -5
View File
@@ -1,4 +1,4 @@
import {Decorator, onChange} from 'angular2/src/core/annotations_impl/annotations';
import {Directive, onChange} from 'angular2/src/core/annotations_impl/annotations';
import {Ancestor} from 'angular2/src/core/annotations_impl/visibility';
import {ElementRef} from 'angular2/src/core/compiler/element_ref';
import {Optional} from 'angular2/di';
@@ -25,7 +25,7 @@ import {Validators} from './validators';
*
* @exportedAs angular2/forms
*/
@Decorator({
@Directive({
selector: '[control]',
hostListeners: {
'change' : 'onChange($event.target.value)',
@@ -59,7 +59,7 @@ export class DefaultValueAccessor {
*
* @exportedAs angular2/forms
*/
@Decorator({
@Directive({
selector: 'input[type=checkbox][control]',
hostListeners: {
'change' : 'onChange($event.target.checked)'
@@ -118,7 +118,7 @@ export class CheckboxControlValueAccessor {
*
* @exportedAs angular2/forms
*/
@Decorator({
@Directive({
lifecycle: [onChange],
selector: '[control]',
properties: {
@@ -215,7 +215,7 @@ export class ControlDirective {
*
* @exportedAs angular2/forms
*/
@Decorator({
@Directive({
selector: '[control-group]',
properties: {
'controlGroup' : 'control-group'
modules/angular2/src/forms/validator_directives.js
Vendored
+2 -2
View File
@@ -1,9 +1,9 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {Validators} from './validators';
import {ControlDirective} from './directives';
@Decorator({
@Directive({
selector: '[required]'
})
export class RequiredValidatorDirective {
modules/angular2/src/render/api.js
Vendored
+1 -1
View File
@@ -109,7 +109,7 @@ export class ProtoViewDto {
}
export class DirectiveMetadata {
static get DECORATOR_TYPE() { return 0; }
static get DIRECTIVE_TYPE() { return 0; }
static get COMPONENT_TYPE() { return 1; }
id:any;
selector:string;
modules/angular2/src/router/router_link.js
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {ElementRef} from 'angular2/core';
import {isPresent} from 'angular2/src/facade/lang';
@@ -27,7 +27,7 @@ import {Router} from './router';
*
* @exportedAs angular2/router
*/
@Decorator({
@Directive({
selector: '[router-link]',
properties: {
'route': 'routerLink',
modules/angular2/src/router/router_outlet.js
Vendored
+2 -2
View File
@@ -1,13 +1,13 @@
import {Promise, PromiseWrapper} from 'angular2/src/facade/async';
import {Decorator} from 'angular2/src/core/annotations_impl/annotations';
import {Directive} from 'angular2/src/core/annotations_impl/annotations';
import {Compiler, ViewContainerRef} from 'angular2/core';
import {Injector, bind} from 'angular2/di';
import * as routerMod from './router';
import {Instruction, RouteParams} from './instruction'
@Decorator({
@Directive({
selector: 'router-outlet'
})
export class RouterOutlet {
modules/angular2/src/transform/directive_processor/transformer.dart
+1 -1
View File
@@ -16,7 +16,7 @@ import 'rewriter.dart';
/// reflector.
///
/// This will also create .ng_deps.dart files for classes annotated
/// with @Component, @View, @Decorator, etc.
/// with @Component, @View, @Directive, etc.
///
/// This transformer is the first phase in a two-phase transform. It should
/// be followed by {@link DirectiveLinker}.
modules/angular2/src/transform/template_compiler/directive_metadata_reader.dart
+3 -3
View File
@@ -15,8 +15,8 @@ DirectiveMetadata readDirectiveMetadata(RegisteredType t) {
num _getDirectiveType(String annotationName) {
// TODO(kegluneq): Detect subtypes & implementations of `Directive`s.
switch (annotationName) {
case 'Decorator':
return DirectiveMetadata.DECORATOR_TYPE;
case 'Directive':
return DirectiveMetadata.DIRECTIVE_TYPE;
case 'Component':
return DirectiveMetadata.COMPONENT_TYPE;
default:
@@ -101,7 +101,7 @@ class _DirectiveMetadataVisitor extends Object
if (compileChildrenValue is! BooleanLiteral) {
logger.error(
'Angular 2 currently only supports boolean literal values for '
'Decorator#compileChildren.'
'Directive#compileChildren.'
' Source: ${compileChildrenValue}');
return;
}