Skip to content

Commit f75a50c

Browse files
tboschtbosch
committed
refactor(compiler): rename decorator directives into directive
BREAKING CHANGE: Previously, `Directive` was the abstract base class of several directives. Now, `Directive` is the former `Decorator`, and `Component` inherits from it.
1 parent c671706 commit f75a50c

71 files changed

Lines changed: 382 additions & 436 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎modules/angular2/annotations.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
* @description
55
*
66
* Annotations provide the additional information that Angular requires in order to run your application. This module
7-
* contains {@link Component}, {@link Decorator}, and {@link View} annotations, as well as {@link Parent} and {@link Ancestor} annotations that are
7+
* contains {@link Component}, {@link Directive}, and {@link View} annotations, as well as {@link Parent} and {@link Ancestor} annotations that are
88
* used by Angular to resolve dependencies.
99
*
1010
*/

‎modules/angular2/docs/core/02_directives.md‎

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,7 @@ Directives are the cornerstone of an Angular application. We use Directives to b
66

77
Angular applications do not have a main method. Instead they have a root Component. Dependency Injection then assembles the directives into a working Angular application.
88

9-
There are three different kinds of directives (described in more detail in later sections).
10-
11-
1. *Decorators*: can be placed on any DOM element and can be combined with other directives.
12-
2. *Components*: Components have an encapsulated view and can configure injectors.
13-
9+
Directives with an encapsulated view and an optional injector are called *Components*.
1410

1511

1612
## CSS Selectors
@@ -53,18 +49,18 @@ CSS Selectors can be combined:
5349

5450

5551

56-
## Decorators
52+
## Directives
5753

5854
The simplest kind of directive is a decorator. Directives are usefull for encapsulating behavior.
5955

6056
* Multiple decorators can be placed on a single element.
61-
* Decorators do not introduce new evaluation context.
62-
* Decorators are registered through the `@Decorator` meta-data annotation.
57+
* Directives do not introduce new evaluation context.
58+
* Directives are registered through the `@Directive` meta-data annotation.
6359

6460
Here is a trivial example of a tooltip decorator. The directive will log a tooltip into the console on every time mouse enters a region:
6561

6662
```
67-
@Decorator({
63+
@Directive({
6864
selector: '[tooltip]', // CSS Selector which triggers the decorator
6965
properties: { // List which properties need to be bound
7066
text: 'tooltip' // - DOM element tooltip property should be
@@ -75,7 +71,7 @@ Here is a trivial example of a tooltip decorator. The directive will log a toolt
7571
})
7672
class Form { // Directive controller class, instantiated
7773
// when CSS matches.
78-
text:string; // text property on the Decorator Controller.
74+
text:string; // text property on the Directive Controller.
7975
8076
show(event) { // Show method which implements the show action.
8177
console.log(this.text);
@@ -238,7 +234,7 @@ class MyService {} | Assume a service which needs to be inject
238234
}) |
239235
class MyApp {} |
240236
|
241-
@Decorator({ | This is the directive into which we would like
237+
@Directive({ | This is the directive into which we would like
242238
selector: '[house]' | to inject the MyService.
243239
}) |
244240
class House { |
@@ -285,30 +281,30 @@ Here is an example of the kinds of injections which can be achieved:
285281
}) |
286282
class MyApp {} |
287283
|
288-
@Decorator({ selector: 'form' }) |
284+
@Directive({ selector: 'form' }) |
289285
class Form { |
290286
constructor( |
291287
@descendant sets:Query<FieldSet> |
292288
) { |
293289
} |
294290
} |
295291
|
296-
@Decorator({ selector: 'fieldset' }) |
292+
@Directive({ selector: 'fieldset' }) |
297293
class FieldSet { |
298294
constructor( |
299295
@child sets:Query<Field> |
300296
) { ... } |
301297
} |
302298
|
303-
@Decorator({ selector: 'field' }) |
299+
@Directive({ selector: 'field' }) |
304300
class Field { |
305301
constructor( |
306302
@ancestor field:Form, |
307303
@parent field:FieldSet, |
308304
) { ... } |
309305
} |
310306
|
311-
@Decorator({ selector: '[primary]'}) |
307+
@Directive({ selector: '[primary]'}) |
312308
class Primary { |
313309
constructor(field:Field ) { ... } |
314310
} |

‎modules/angular2/src/core/annotations/annotations.es6‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55

66
export {
77
Component as ComponentAnnotation,
8-
Decorator as DecoratorAnnotation,
98
Directive as DirectiveAnnotation,
109
onDestroy, onChange, onAllChangesDone
1110
} from '../annotations_impl/annotations';

0 commit comments

Comments
 (0)