cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(core): renames Property into Input and Event into Output

Browse Source 
BREACKING CHANGE:

Before: @Directive({properties: ['one'], events: ['two']})
After: @Directive({inputs: ['one'], outputs: ['two']})

Before: @Component({properties: ['one'], events: ['two']})
After: @Componet({inputs: ['one'], outputs: ['two']})

Before: class A {@Property() one; @Event() two;}
After: class A {@Input() one; @Output() two;}
This commit is contained in:
vsavkin
2015-09-30 20:59:23 -07:00
parent 33593cf8a2
commit adbfd29fd7
89 changed files with 405 additions and 423 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
modules/angular2/src/compiler/change_definition_factory.ts
View File

@ -77,8 +77,8 @@ class ProtoViewVisitor implements TemplateAstVisitor {
if (ast.isBound()) {
this.boundElementCount++;
}
templateVisitAll(this, ast.properties, null);
templateVisitAll(this, ast.events);
templateVisitAll(this, ast.inputs, null);
templateVisitAll(this, ast.outputs);
templateVisitAll(this, ast.exportAsVars);
for (var i = 0; i < ast.directives.length; i++) {
ast.directives[i].visit(this, i);
@ -158,7 +158,7 @@ class ProtoViewVisitor implements TemplateAstVisitor {
});
this.directiveRecords.push(directiveRecord);
templateVisitAll(this, ast.properties, directiveRecord);
templateVisitAll(this, ast.inputs, directiveRecord);
var bindingRecords = this.bindingRecords;
if (directiveRecord.callOnChanges) {
bindingRecords.push(BindingRecord.createDirectiveOnChanges(directiveRecord));

2
modules/angular2/src/compiler/command_compiler.ts
View File

@ -246,7 +246,7 @@ class CommandBuilderVisitor<R> implements TemplateAstVisitor {
}
visitElement(ast: ElementAst, context: any): any {
var component = ast.getComponent();
var eventTargetAndNames = visitAndReturnContext(this, ast.events, []);
var eventTargetAndNames = visitAndReturnContext(this, ast.outputs, []);
var variableNameAndValues = [];
if (isBlank(component)) {
ast.exportAsVars.forEach((varAst) => {

56
modules/angular2/src/compiler/directive_metadata.ts
View File

@ -94,16 +94,16 @@ export class CompileTemplateMetadata {
}
export class CompileDirectiveMetadata {
static create({type, isComponent, dynamicLoadable, selector, exportAs, changeDetection,
properties, events, host, lifecycleHooks, template}: {
static create({type, isComponent, dynamicLoadable, selector, exportAs, changeDetection, inputs,
outputs, host, lifecycleHooks, template}: {
type?: CompileTypeMetadata,
isComponent?: boolean,
dynamicLoadable?: boolean,
selector?: string,
exportAs?: string,
changeDetection?: ChangeDetectionStrategy,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
lifecycleHooks?: LifecycleHooks[],
template?: CompileTemplateMetadata
@ -123,22 +123,22 @@ export class CompileDirectiveMetadata {
}
});
}
var propsMap = {};
if (isPresent(properties)) {
properties.forEach((bindConfig: string) => {
var inputsMap = {};
if (isPresent(inputs)) {
inputs.forEach((bindConfig: string) => {
// canonical syntax: `dirProp: elProp`
// if there is no `:`, use dirProp = elProp
var parts = splitAtColon(bindConfig, [bindConfig, bindConfig]);
propsMap[parts[0]] = parts[1];
inputsMap[parts[0]] = parts[1];
});
}
var eventsMap = {};
if (isPresent(events)) {
events.forEach((bindConfig: string) => {
var outputsMap = {};
if (isPresent(outputs)) {
outputs.forEach((bindConfig: string) => {
// canonical syntax: `dirProp: elProp`
// if there is no `:`, use dirProp = elProp
var parts = splitAtColon(bindConfig, [bindConfig, bindConfig]);
eventsMap[parts[0]] = parts[1];
outputsMap[parts[0]] = parts[1];
});
}
@ -149,8 +149,8 @@ export class CompileDirectiveMetadata {
selector: selector,
exportAs: exportAs,
changeDetection: changeDetection,
properties: propsMap,
events: eventsMap,
inputs: inputsMap,
outputs: outputsMap,
hostListeners: hostListeners,
hostProperties: hostProperties,
hostAttributes: hostAttributes,
@ -164,23 +164,23 @@ export class CompileDirectiveMetadata {
selector: string;
exportAs: string;
changeDetection: ChangeDetectionStrategy;
properties: StringMap<string, string>;
events: StringMap<string, string>;
inputs: StringMap<string, string>;
outputs: StringMap<string, string>;
hostListeners: StringMap<string, string>;
hostProperties: StringMap<string, string>;
hostAttributes: StringMap<string, string>;
lifecycleHooks: LifecycleHooks[];
template: CompileTemplateMetadata;
constructor({type, isComponent, dynamicLoadable, selector, exportAs, changeDetection, properties,
events, hostListeners, hostProperties, hostAttributes, lifecycleHooks, template}: {
constructor({type, isComponent, dynamicLoadable, selector, exportAs, changeDetection, inputs,
outputs, hostListeners, hostProperties, hostAttributes, lifecycleHooks, template}: {
type?: CompileTypeMetadata,
isComponent?: boolean,
dynamicLoadable?: boolean,
selector?: string,
exportAs?: string,
changeDetection?: ChangeDetectionStrategy,
properties?: StringMap<string, string>,
events?: StringMap<string, string>,
inputs?: StringMap<string, string>,
outputs?: StringMap<string, string>,
hostListeners?: StringMap<string, string>,
hostProperties?: StringMap<string, string>,
hostAttributes?: StringMap<string, string>,
@ -193,8 +193,8 @@ export class CompileDirectiveMetadata {
this.selector = selector;
this.exportAs = exportAs;
this.changeDetection = changeDetection;
this.properties = properties;
this.events = events;
this.inputs = inputs;
this.outputs = outputs;
this.hostListeners = hostListeners;
this.hostProperties = hostProperties;
this.hostAttributes = hostAttributes;
@ -212,8 +212,8 @@ export class CompileDirectiveMetadata {
changeDetection: isPresent(data['changeDetection']) ?
CHANGE_DECTION_STRATEGY_VALUES[data['changeDetection']] :
data['changeDetection'],
properties: data['properties'],
events: data['events'],
inputs: data['inputs'],
outputs: data['outputs'],
hostListeners: data['hostListeners'],
hostProperties: data['hostProperties'],
hostAttributes: data['hostAttributes'],
@ -233,8 +233,8 @@ export class CompileDirectiveMetadata {
'type': isPresent(this.type) ? this.type.toJson() : this.type,
'changeDetection': isPresent(this.changeDetection) ? serializeEnum(this.changeDetection) :
this.changeDetection,
'properties': this.properties,
'events': this.events,
'inputs': this.inputs,
'outputs': this.outputs,
'hostListeners': this.hostListeners,
'hostProperties': this.hostProperties,
'hostAttributes': this.hostAttributes,
@ -253,8 +253,8 @@ export function createHostComponentMeta(componentType: CompileTypeMetadata,
template: new CompileTemplateMetadata(
{template: template, templateUrl: '', styles: [], styleUrls: [], ngContentSelectors: []}),
changeDetection: ChangeDetectionStrategy.Default,
properties: [],
events: [],
inputs: [],
outputs: [],
host: {},
lifecycleHooks: [],
isComponent: true,

4
modules/angular2/src/compiler/runtime_metadata.ts
View File

@ -58,8 +58,8 @@ export class RuntimeMetadataResolver {
{name: stringify(directiveType), moduleId: moduleId, runtime: directiveType}),
template: templateMeta,
changeDetection: changeDetectionStrategy,
properties: directiveAnnotation.properties,
events: directiveAnnotation.events,
inputs: directiveAnnotation.inputs,
outputs: directiveAnnotation.outputs,
host: directiveAnnotation.host,
lifecycleHooks: ListWrapper.filter(LIFECYCLE_HOOKS_VALUES,
hook => hasLifecycleHook(hook, directiveType))

6
modules/angular2/src/compiler/template_ast.ts
View File

@ -56,7 +56,7 @@ export class VariableAst implements TemplateAst {
export class ElementAst implements TemplateAst {
constructor(public name: string, public attrs: AttrAst[],
public properties: BoundElementPropertyAst[], public events: BoundEventAst[],
public inputs: BoundElementPropertyAst[], public outputs: BoundEventAst[],
public exportAsVars: VariableAst[], public directives: DirectiveAst[],
public children: TemplateAst[], public ngContentIndex: number,
public sourceInfo: string) {}
@ -65,7 +65,7 @@ export class ElementAst implements TemplateAst {
}
isBound(): boolean {
return (this.properties.length > 0 || this.events.length > 0 || this.exportAsVars.length > 0 ||
return (this.inputs.length > 0 || this.outputs.length > 0 || this.exportAsVars.length > 0 ||
this.directives.length > 0);
}
@ -95,7 +95,7 @@ export class BoundDirectivePropertyAst implements TemplateAst {
export class DirectiveAst implements TemplateAst {
constructor(public directive: CompileDirectiveMetadata,
public properties: BoundDirectivePropertyAst[],
public inputs: BoundDirectivePropertyAst[],
public hostProperties: BoundElementPropertyAst[], public hostEvents: BoundEventAst[],
public exportAsVars: VariableAst[], public sourceInfo: string) {}
visit(visitor: TemplateAstVisitor, context: any): any {

4
modules/angular2/src/compiler/template_compiler.ts
View File

@ -65,8 +65,8 @@ export class TemplateCompiler {
selector: directive.selector,
exportAs: directive.exportAs,
changeDetection: directive.changeDetection,
properties: directive.properties,
events: directive.events,
inputs: directive.inputs,
outputs: directive.outputs,
hostListeners: directive.hostListeners,
hostProperties: directive.hostProperties,
hostAttributes: directive.hostAttributes,

4
modules/angular2/src/compiler/template_parser.ts
View File

@ -415,7 +415,7 @@ class TemplateParseVisitor implements HtmlAstVisitor {
this._createDirectiveHostPropertyAsts(elementName, directive.hostProperties, sourceInfo,
hostProperties);
this._createDirectiveHostEventAsts(directive.hostListeners, sourceInfo, hostEvents);
this._createDirectivePropertyAsts(directive.properties, props, directiveProperties);
this._createDirectivePropertyAsts(directive.inputs, props, directiveProperties);
var exportAsVars = [];
possibleExportAsVars.forEach((varAst) => {
if ((varAst.value.length === 0 && directive.isComponent) ||
@ -489,7 +489,7 @@ class TemplateParseVisitor implements HtmlAstVisitor {
var boundElementProps: BoundElementPropertyAst[] = [];
var boundDirectivePropsIndex = new Map<string, BoundDirectivePropertyAst>();
directives.forEach((directive: DirectiveAst) => {
directive.properties.forEach((prop: BoundDirectivePropertyAst) => {
directive.inputs.forEach((prop: BoundDirectivePropertyAst) => {
boundDirectivePropsIndex.set(prop.templateName, prop);
});
});

2
modules/angular2/src/core/change_detection/change_detector_ref.ts
View File

@ -157,7 +157,7 @@ export class ChangeDetectorRef {
* }
* }
*
* @Component({selector: 'live-data', properties: ['live']})
* @Component({selector: 'live-data', inputs: ['live']})
* @View({
* template: `Data: {{dataProvider.data}}`
* })

4
modules/angular2/src/core/change_detection/exceptions.ts
View File

@ -21,7 +21,7 @@ import {BaseException, WrappedException} from "angular2/src/core/facade/exceptio
* parentProp = "init";
* }
*
* @Directive({selector: 'child', properties: ['prop']})
* @Directive({selector: 'child', inputs: ['prop']})
* class Child {
* constructor(public parent: Parent) {}
*
@ -49,7 +49,7 @@ export class ExpressionChangedAfterItHasBeenCheckedException extends BaseExcepti
* ### Example ([live demo](http://plnkr.co/edit/2Kywoz?p=preview))
*
* ```typescript
* @Directive({selector: 'child', properties: ['prop']})
* @Directive({selector: 'child', inputs: ['prop']})
* class Child {
* prop;
* }

37
modules/angular2/src/core/compiler/directive_resolver.ts
View File

@ -5,8 +5,8 @@ import {ListWrapper, StringMap, StringMapWrapper} from 'angular2/src/core/facade
import {
DirectiveMetadata,
ComponentMetadata,
PropertyMetadata,
EventMetadata,
InputMetadata,
OutputMetadata,
HostBindingMetadata,
HostListenerMetadata,
ContentChildrenMetadata,
@ -45,26 +45,26 @@ export class DirectiveResolver {
private _mergeWithPropertyMetadata(dm: DirectiveMetadata,
propertyMetadata:
StringMap<string, any[]>): DirectiveMetadata {
var properties = [];
var events = [];
var inputs = [];
var outputs = [];
var host = {};
var queries = {};
StringMapWrapper.forEach(propertyMetadata, (metadata: any[], propName: string) => {
metadata.forEach(a => {
if (a instanceof PropertyMetadata) {
if (a instanceof InputMetadata) {
if (isPresent(a.bindingPropertyName)) {
properties.push(`${propName}: ${a.bindingPropertyName}`);
inputs.push(`${propName}: ${a.bindingPropertyName}`);
} else {
properties.push(propName);
inputs.push(propName);
}
}
if (a instanceof EventMetadata) {
if (a instanceof OutputMetadata) {
if (isPresent(a.bindingPropertyName)) {
events.push(`${propName}: ${a.bindingPropertyName}`);
outputs.push(`${propName}: ${a.bindingPropertyName}`);
} else {
events.push(propName);
outputs.push(propName);
}
}
@ -98,15 +98,14 @@ export class DirectiveResolver {
}
});
});
return this._merge(dm, properties, events, host, queries);
return this._merge(dm, inputs, outputs, host, queries);
}
private _merge(dm: DirectiveMetadata, properties: string[], events: string[],
private _merge(dm: DirectiveMetadata, inputs: string[], outputs: string[],
host: StringMap<string, string>,
queries: StringMap<string, any>): DirectiveMetadata {
var mergedProperties =
isPresent(dm.properties) ? ListWrapper.concat(dm.properties, properties) : properties;
var mergedEvents = isPresent(dm.events) ? ListWrapper.concat(dm.events, events) : events;
var mergedInputs = isPresent(dm.inputs) ? ListWrapper.concat(dm.inputs, inputs) : inputs;
var mergedOutputs = isPresent(dm.outputs) ? ListWrapper.concat(dm.outputs, outputs) : outputs;
var mergedHost = isPresent(dm.host) ? StringMapWrapper.merge(dm.host, host) : host;
var mergedQueries =
isPresent(dm.queries) ? StringMapWrapper.merge(dm.queries, queries) : queries;
@ -114,8 +113,8 @@ export class DirectiveResolver {
if (dm instanceof ComponentMetadata) {
return new ComponentMetadata({
selector: dm.selector,
properties: mergedProperties,
events: mergedEvents,
inputs: mergedInputs,
outputs: mergedOutputs,
host: mergedHost,
bindings: dm.bindings,
exportAs: dm.exportAs,
@ -129,8 +128,8 @@ export class DirectiveResolver {
} else {
return new DirectiveMetadata({
selector: dm.selector,
properties: mergedProperties,
events: mergedEvents,
inputs: mergedInputs,
outputs: mergedOutputs,
host: mergedHost,
bindings: dm.bindings,
exportAs: dm.exportAs,

7
modules/angular2/src/core/compiler/element_injector.ts
View File

@ -151,7 +151,8 @@ export class DirectiveBinding extends ResolvedBinding {
}
get eventEmitters(): string[] {
return isPresent(this.metadata) && isPresent(this.metadata.events) ? this.metadata.events : [];
return isPresent(this.metadata) && isPresent(this.metadata.outputs) ? this.metadata.outputs :
[];
}
static createFromBinding(binding: Binding, meta: DirectiveMetadata): DirectiveBinding {
@ -170,9 +171,9 @@ export class DirectiveBinding extends ResolvedBinding {
RenderDirectiveMetadata.DIRECTIVE_TYPE,
selector: meta.selector,
compileChildren: meta.compileChildren,
events: meta.events,
outputs: meta.outputs,
host: isPresent(meta.host) ? MapWrapper.createFromStringMap(meta.host) : null,
properties: meta.properties,
inputs: meta.inputs,
readAttributes: DirectiveBinding._readAttributes(<any>deps),
queries: meta.queries,

2
modules/angular2/src/core/compiler/interfaces.ts
View File

@ -50,7 +50,7 @@ export var LIFECYCLE_HOOKS_VALUES = [
* propB;
*
* onChanges(changes: {[idx: string, PropertyUpdate]}): void {
* // This will get called after any of the properties have been updated.
* // This will get called after any of the inputs have been updated.
* if (changes['propA']) {
* // if propA was updated
* }

2
modules/angular2/src/core/directives/ng_class.ts
View File

@ -35,7 +35,7 @@ import {
* </div>
* ```
*/
@Directive({selector: '[ng-class]', properties: ['rawClass: ng-class', 'initialClasses: class']})
@Directive({selector: '[ng-class]', inputs: ['rawClass: ng-class', 'initialClasses: class']})
export class NgClass implements DoCheck, OnDestroy {
private _differ: any;
private _mode: string;

2
modules/angular2/src/core/directives/ng_for.ts
View File

@ -39,7 +39,7 @@ import {isPresent, isBlank} from 'angular2/src/core/facade/lang';
* - `<li template="ng-for #item of items; #i = index">...</li>`
* - `<template ng-for #item [ng-for-of]="items" #i="index"><li>...</li></template>`
*/
@Directive({selector: '[ng-for][ng-for-of]', properties: ['ngForOf']})
@Directive({selector: '[ng-for][ng-for-of]', inputs: ['ngForOf']})
export class NgFor implements DoCheck {
_ngForOf: any;
private _differ: IterableDiffer;

2
modules/angular2/src/core/directives/ng_if.ts
View File

@ -24,7 +24,7 @@ import {isBlank} from 'angular2/src/core/facade/lang';
* - `<div template="ng-if condition">...</div>`
* - `<template [ng-if]="condition"><div>...</div></template>`
*/
@Directive({selector: '[ng-if]', properties: ['ngIf']})
@Directive({selector: '[ng-if]', inputs: ['ngIf']})
export class NgIf {
private _prevCondition: boolean = null;

2
modules/angular2/src/core/directives/ng_style.ts
View File

@ -29,7 +29,7 @@ import {isPresent, isBlank, print} from 'angular2/src/core/facade/lang';
* - `<div [ng-style]="{'text-align': alignExp}"></div>`
* - `<div [ng-style]="styleExp"></div>`
*/
@Directive({selector: '[ng-style]', properties: ['rawStyle: ng-style']})
@Directive({selector: '[ng-style]', inputs: ['rawStyle: ng-style']})
export class NgStyle implements DoCheck {
_rawStyle;
_differ: KeyValueDiffer;

4
modules/angular2/src/core/directives/ng_switch.ts
View File

@ -39,7 +39,7 @@ export class SwitchView {
* </ANY>
* ```
*/
@Directive({selector: '[ng-switch]', properties: ['ngSwitch']})
@Directive({selector: '[ng-switch]', inputs: ['ngSwitch']})
export class NgSwitch {
private _switchValue: any;
private _useDefault: boolean = false;
@ -139,7 +139,7 @@ export class NgSwitch {
* <template ng-switch-when="stringValue">...</template>
* ```
*/
@Directive({selector: '[ng-switch-when]', properties: ['ngSwitchWhen']})
@Directive({selector: '[ng-switch-when]', inputs: ['ngSwitchWhen']})
export class NgSwitchWhen {
// `_WHEN_DEFAULT` is used as a marker for a not yet initialized value
_value: any = _WHEN_DEFAULT;

6
modules/angular2/src/core/facade/async.ts
View File

@ -91,7 +91,7 @@ export class Observable {
}
/**
* Use by directives and components to emit custom {@link Event}s.
* Use by directives and components to emit custom Events.
*
* ## Examples
*
@ -109,8 +109,8 @@ export class Observable {
* </div>`})
* export class Zippy {
* visible: boolean = true;
* @Event() open: EventEmitter = new EventEmitter();
* @Event() close: EventEmitter = new EventEmitter();
* @Output() open: EventEmitter = new EventEmitter();
* @Output() close: EventEmitter = new EventEmitter();
*
* toggle() {
* this.visible = !this.visible;

2
modules/angular2/src/core/forms/directives/ng_control_group.ts
View File

@ -53,7 +53,7 @@ const controlGroupBinding =
@Directive({
selector: '[ng-control-group]',
bindings: [controlGroupBinding],
properties: ['name: ng-control-group'],
inputs: ['name: ng-control-group'],
exportAs: 'form'
})
export class NgControlGroup extends ControlContainer implements OnInit,

4
modules/angular2/src/core/forms/directives/ng_control_name.ts
View File

@ -75,8 +75,8 @@ const controlNameBinding =
@Directive({
selector: '[ng-control]',
bindings: [controlNameBinding],
properties: ['name: ngControl', 'model: ngModel'],
events: ['update: ngModel'],
inputs: ['name: ngControl', 'model: ngModel'],
outputs: ['update: ngModel'],
exportAs: 'form'
})
export class NgControlName extends NgControl implements OnChanges,

2
modules/angular2/src/core/forms/directives/ng_form.ts
View File

@ -85,7 +85,7 @@ const formDirectiveBinding =
host: {
'(submit)': 'onSubmit()',
},
events: ['ngSubmit'],
outputs: ['ngSubmit'],
exportAs: 'form'
})
export class NgForm extends ControlContainer implements Form {

4
modules/angular2/src/core/forms/directives/ng_form_control.ts
View File

@ -65,8 +65,8 @@ const formControlBinding =
@Directive({
selector: '[ng-form-control]',
bindings: [formControlBinding],
properties: ['form: ngFormControl', 'model: ngModel'],
events: ['update: ngModel'],
inputs: ['form: ngFormControl', 'model: ngModel'],
outputs: ['update: ngModel'],
exportAs: 'form'
})
export class NgFormControl extends NgControl implements OnChanges {

4
modules/angular2/src/core/forms/directives/ng_form_model.ts
View File

@ -92,9 +92,9 @@ const formDirectiveBinding =
@Directive({
selector: '[ng-form-model]',
bindings: [formDirectiveBinding],
properties: ['form: ng-form-model'],
inputs: ['form: ng-form-model'],
host: {'(submit)': 'onSubmit()'},
events: ['ngSubmit'],
outputs: ['ngSubmit'],
exportAs: 'form'
})
export class NgFormModel extends ControlContainer implements Form,

4
modules/angular2/src/core/forms/directives/ng_model.ts
View File

@ -36,8 +36,8 @@ const formControlBinding = CONST_EXPR(new Binding(NgControl, {toAlias: forwardRe
@Directive({
selector: '[ng-model]:not([ng-control]):not([ng-form-control])',
bindings: [formControlBinding],
properties: ['model: ngModel'],
events: ['update: ngModel'],
inputs: ['model: ngModel'],
outputs: ['update: ngModel'],
exportAs: 'form'
})
export class NgModel extends NgControl implements OnChanges {

28
modules/angular2/src/core/metadata.dart
View File

@ -14,15 +14,15 @@ export './metadata/view.dart';
* See: [DirectiveMetadata] for docs.
*/
class Directive extends DirectiveMetadata {
const Directive({String selector, List<String> properties,
List<String> events, Map<String, String> host,
const Directive({String selector, List<String> inputs,
List<String> outputs, Map<String, String> host,
List bindings, String exportAs, String moduleId,
Map<String, dynamic> queries,
bool compileChildren: true})
: super(
selector: selector,
properties: properties,
events: events,
inputs: inputs,
outputs: outputs,
host: host,
bindings: bindings,
exportAs: exportAs,
@ -35,15 +35,15 @@ class Directive extends DirectiveMetadata {
* See: [ComponentMetadata] for docs.
*/
class Component extends ComponentMetadata {
const Component({String selector, List<String> properties,
List<String> events, Map<String, String> host,
const Component({String selector, List<String> inputs,
List<String> outputs, Map<String, String> host,
List bindings, String exportAs, String moduleId,
Map<String, dynamic> queries,
bool compileChildren, List viewBindings, ChangeDetectionStrategy changeDetection})
: super(
selector: selector,
properties: properties,
events: events,
inputs: inputs,
outputs: outputs,
host: host,
bindings: bindings,
exportAs: exportAs,
@ -134,18 +134,18 @@ class ViewChild extends ViewChildMetadata {
}
/**
* See: [PropertyMetadata] for docs.
* See: [InputMetadata] for docs.
*/
class Property extends PropertyMetadata {
const Property([String bindingPropertyName])
class Input extends InputMetadata {
const Input([String bindingPropertyName])
: super(bindingPropertyName);
}
/**
* See: [EventMetadata] for docs.
* See: [OutputMetadata] for docs.
*/
class Event extends EventMetadata {
const Event([String bindingPropertyName])
class Output extends OutputMetadata {
const Output([String bindingPropertyName])
: super(bindingPropertyName);
}

48
modules/angular2/src/core/metadata.ts
View File

@ -17,8 +17,8 @@ export {
ComponentMetadata,
DirectiveMetadata,
PipeMetadata,
PropertyMetadata,
EventMetadata,
InputMetadata,
OutputMetadata,
HostBindingMetadata,
HostListenerMetadata
} from './metadata/directives';
@ -39,8 +39,8 @@ import {
ComponentMetadata,
DirectiveMetadata,
PipeMetadata,
PropertyMetadata,
EventMetadata,
InputMetadata,
OutputMetadata,
HostBindingMetadata,
HostListenerMetadata
} from './metadata/directives';
@ -147,8 +147,8 @@ export interface ViewDecorator extends TypeDecorator {
export interface DirectiveFactory {
(obj: {
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -158,8 +158,8 @@ export interface DirectiveFactory {
}): DirectiveDecorator;
new (obj: {
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -215,8 +215,8 @@ export interface DirectiveFactory {
export interface ComponentFactory {
(obj: {
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -228,8 +228,8 @@ export interface ComponentFactory {
}): ComponentDecorator;
new (obj: {
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -452,21 +452,21 @@ export interface PipeFactory {
}
/**
* {@link PropertyMetadata} factory for creating decorators.
* {@link InputMetadata} factory for creating decorators.
*
* See {@link PropertyMetadata}.
* See {@link InputMetadata}.
*/
export interface PropertyFactory {
export interface InputFactory {
(bindingPropertyName?: string): any;
new (bindingPropertyName?: string): any;
}
/**
* {@link EventMetadata} factory for creating decorators.
* {@link OutputMetadata} factory for creating decorators.
*
* See {@link EventMetadata}.
* See {@link OutputMetadata}.
*/
export interface EventFactory {
export interface OutputFactory {
(bindingPropertyName?: string): any;
new (bindingPropertyName?: string): any;
}
@ -567,18 +567,18 @@ export var ViewQuery: QueryFactory = makeParamDecorator(ViewQueryMetadata);
export var Pipe: PipeFactory = <PipeFactory>makeDecorator(PipeMetadata);
/**
* {@link PropertyMetadata} factory function.
* {@link InputMetadata} factory function.
*
* See {@link PropertyMetadata}.
* See {@link InputMetadata}.
*/
export var Property: PropertyFactory = makePropDecorator(PropertyMetadata);
export var Input: InputFactory = makePropDecorator(InputMetadata);
/**
* {@link EventMetadata} factory function.
* {@link OutputMetadata} factory function.
*
* See {@link EventMetadata}.
* See {@link OutputMetadatas}.
*/
export var Event: EventFactory = makePropDecorator(EventMetadata);
export var Output: OutputFactory = makePropDecorator(OutputMetadata);
/**
* {@link HostBindingMetadata} factory function.

2
modules/angular2/src/core/metadata/di.ts
View File

@ -71,7 +71,7 @@ export class AttributeMetadata extends DependencyMetadata {
* ```javascript
* @Component({
* selector: 'pane',
* properties: ['title']
* inputs: ['title']
* })
* @View(...)
* class Pane {

70
modules/angular2/src/core/metadata/directives.ts
View File

@ -96,7 +96,7 @@ import {ChangeDetectionStrategy} from 'angular2/src/core/change_detection';
*
* @Directive({
* selector: '[dependency]',
* properties: [
* inputs: [
* 'id: dependency'
* ]
* })
@ -242,7 +242,7 @@ import {ChangeDetectionStrategy} from 'angular2/src/core/change_detection';
* ```
* @Directive({
* selector: '[tooltip]',
* properties: [
* inputs: [
* 'text: tooltip'
* ],
* host: {
@ -332,7 +332,7 @@ import {ChangeDetectionStrategy} from 'angular2/src/core/change_detection';
* ```
* @Directive({
* selector: '[unless]',
* properties: ['unless']
* inputs: ['unless']
* })
* export class Unless {
* viewContainer: ViewContainerRef;
@ -417,11 +417,11 @@ export class DirectiveMetadata extends InjectableMetadata {
selector: string;
/**
* Enumerates the set of data-bound properties for a directive
* Enumerates the set of data-bound input properties for a directive
*
* Angular automatically updates data-bound properties during change detection.
* Angular automatically updates input properties during change detection.
*
* The `properties` property defines a set of `directiveProperty` to `bindingProperty`
* The `inputs` property defines a set of `directiveProperty` to `bindingProperty`
* configuration:
*
* - `directiveProperty` specifies the component property where the value is written.
@ -436,7 +436,7 @@ export class DirectiveMetadata extends InjectableMetadata {
* ```typescript
* @Component({
* selector: 'bank-account',
* properties: ['bankName', 'id: account-id']
* inputs: ['bankName', 'id: account-id']
* })
* @View({
* template: `
@ -465,15 +465,15 @@ export class DirectiveMetadata extends InjectableMetadata {
* ```
*
*/
properties: string[];
inputs: string[];
/**
* Enumerates the set of event-bound properties.
* Enumerates the set of event-bound output properties.
*
* When an event-bound property emits an event, an event handler attached to that event
* When an output property emits an event, an event handler attached to that event
* the template is invoked.
*
* The `events` property defines a set of `directiveProperty` to `bindingProperty`
* The `outputs` property defines a set of `directiveProperty` to `bindingProperty`
* configuration:
*
* - `directiveProperty` specifies the component property that emits events.
@ -484,7 +484,7 @@ export class DirectiveMetadata extends InjectableMetadata {
* ```typescript
* @Directive({
* selector: 'interval-dir',
* events: ['everySecond', 'five5Secs: everyFiveSeconds']
* outputs: ['everySecond', 'five5Secs: everyFiveSeconds']
* })
* class IntervalDir {
* everySecond = new EventEmitter();
@ -512,7 +512,7 @@ export class DirectiveMetadata extends InjectableMetadata {
* ```
*
*/
events: string[];
outputs: string[];
/**
* Specify the events, actions, properties and attributes related to the host element.
@ -739,12 +739,12 @@ export class DirectiveMetadata extends InjectableMetadata {
queries: StringMap<string, any>;
constructor({
selector, properties, events, host, bindings, exportAs, moduleId, queries,
selector, inputs, outputs, host, bindings, exportAs, moduleId, queries,
compileChildren = true,
}: {
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -754,8 +754,8 @@ export class DirectiveMetadata extends InjectableMetadata {
} = {}) {
super();
this.selector = selector;
this.properties = properties;
this.events = events;
this.inputs = inputs;
this.outputs = outputs;
this.host = host;
this.exportAs = exportAs;
this.moduleId = moduleId;
@ -861,12 +861,12 @@ export class ComponentMetadata extends DirectiveMetadata {
*/
viewBindings: any[];
constructor({selector, properties, events, host, exportAs, moduleId, bindings, viewBindings,
constructor({selector, inputs, outputs, host, exportAs, moduleId, bindings, viewBindings,
changeDetection = ChangeDetectionStrategy.Default, queries, compileChildren = true}:
{
selector?: string,
properties?: string[],
events?: string[],
inputs?: string[],
outputs?: string[],
host?: StringMap<string, string>,
bindings?: any[],
exportAs?: string,
@ -878,8 +878,8 @@ export class ComponentMetadata extends DirectiveMetadata {
} = {}) {
super({
selector: selector,
properties: properties,
events: events,
inputs: inputs,
outputs: outputs,
host: host,
exportAs: exportAs,
moduleId: moduleId,
@ -922,17 +922,17 @@ export class PipeMetadata extends InjectableMetadata {
}
/**
* Declares a data-bound property.
* Declares a data-bound input property.
*
* Angular automatically updates data-bound properties during change detection.
*
* `PropertyMetadata` takes an optional parameters that specifies that name
* `InputMetadata` takes an optional parameters that specifies that name
* used when instantiating a component in the template. When not provided,
* the class property name is used.
*
* ### Example
*
* The following example creates a component with two data-bound properties.
* The following example creates a component with two input properties.
*
* ```typescript
* @Component({selector: 'bank-account'})
@ -943,8 +943,8 @@ export class PipeMetadata extends InjectableMetadata {
* `
* })
* class BankAccount {
* @Property() bankName: string;
* @Property('account-id') id: string;
* @Input() bankName: string;
* @Input('account-id') id: string;
*
* // this property is not bound, and won't be automatically updated by Angular
* normalizedBankName: string;
@ -963,7 +963,7 @@ export class PipeMetadata extends InjectableMetadata {
* ```
*/
@CONST()
export class PropertyMetadata {
export class InputMetadata {
constructor(
/**
* Name used when instantiating a component in the temlate.
@ -972,12 +972,12 @@ export class PropertyMetadata {
}
/**
* Declares an event-bound property.
* Declares an event-bound output property.
*
* When an event-bound property emits an event, an event handler attached to that event
* When an output property emits an event, an event handler attached to that event
* the template is invoked.
*
* `EventMetadata` takes an optional parameters that specifies that name
* `OutputMetadata` takes an optional parameters that specifies that name
* used when instantiating a component in the template. When not provided,
* the class property name is used.
*
@ -988,8 +988,8 @@ export class PropertyMetadata {
* selector: 'interval-dir',
* })
* class IntervalDir {
* @Event() everySecond = new EventEmitter();
* @Event('everyFiveSeconds') five5Secs = new EventEmitter();
* @Output() everySecond = new EventEmitter();
* @Output('everyFiveSeconds') five5Secs = new EventEmitter();
*
* constructor() {
* setInterval(() => this.everySecond.next("event"), 1000);
@ -1013,7 +1013,7 @@ export class PropertyMetadata {
* ```
*/
@CONST()
export class EventMetadata {
export class OutputMetadata {
constructor(public bindingPropertyName?: string) {}
}

30
modules/angular2/src/core/render/api.ts
View File

@ -143,8 +143,8 @@ export class RenderDirectiveMetadata {
id: any;
selector: string;
compileChildren: boolean;
events: string[];
properties: string[];
outputs: string[];
inputs: string[];
readAttributes: string[];
type: number;
callOnDestroy: boolean;
@ -165,18 +165,18 @@ export class RenderDirectiveMetadata {
// group 2: "event" from "(event)"
private static _hostRegExp = /^(?:(?:\[([^\]]+)\])|(?:\(([^\)]+)\)))$/g;
constructor({id, selector, compileChildren, events, hostListeners, hostProperties, hostAttributes,
properties, readAttributes, type, callOnDestroy, callOnChanges, callDoCheck,
callOnInit, callAfterContentInit, callAfterContentChecked, callAfterViewInit,
callAfterViewChecked, changeDetection, exportAs, queries}: {
constructor({id, selector, compileChildren, outputs, hostListeners, hostProperties,
hostAttributes, inputs, readAttributes, type, callOnDestroy, callOnChanges,
callDoCheck, callOnInit, callAfterContentInit, callAfterContentChecked,
callAfterViewInit, callAfterViewChecked, changeDetection, exportAs, queries}: {
id?: string,
selector?: string,
compileChildren?: boolean,
events?: string[],
outputs?: string[],
hostListeners?: Map<string, string>,
hostProperties?: Map<string, string>,
hostAttributes?: Map<string, string>,
properties?: string[],
inputs?: string[],
readAttributes?: string[],
type?: number,
callOnDestroy?: boolean,
@ -194,11 +194,11 @@ export class RenderDirectiveMetadata {
this.id = id;
this.selector = selector;
this.compileChildren = isPresent(compileChildren) ? compileChildren : true;
this.events = events;
this.outputs = outputs;
this.hostListeners = hostListeners;
this.hostAttributes = hostAttributes;
this.hostProperties = hostProperties;
this.properties = properties;
this.inputs = inputs;
this.readAttributes = readAttributes;
this.type = type;
this.callOnDestroy = callOnDestroy;
@ -214,16 +214,16 @@ export class RenderDirectiveMetadata {
this.queries = queries;
}
static create({id, selector, compileChildren, events, host, properties, readAttributes, type,
static create({id, selector, compileChildren, outputs, host, inputs, readAttributes, type,
callOnDestroy, callOnChanges, callDoCheck, callOnInit, callAfterContentInit,
callAfterContentChecked, callAfterViewInit, callAfterViewChecked, changeDetection,
exportAs, queries}: {
id?: string,
selector?: string,
compileChildren?: boolean,
events?: string[],
outputs?: string[],
host?: Map<string, string>,
properties?: string[],
inputs?: string[],
readAttributes?: string[],
type?: number,
callOnDestroy?: boolean,
@ -259,11 +259,11 @@ export class RenderDirectiveMetadata {
id: id,
selector: selector,
compileChildren: compileChildren,
events: events,
outputs: outputs,
hostListeners: hostListeners,
hostProperties: hostProperties,
hostAttributes: hostAttributes,
properties: properties,
inputs: inputs,
readAttributes: readAttributes,
type: type,
callOnDestroy: callOnDestroy,

4
modules/angular2/src/core/render/dom/compiler/directive_parser.ts
View File

@ -65,8 +65,8 @@ export class DirectiveParser implements CompileStep {
var dirMetadata = this._directives[directiveIndex];
var directiveBinderBuilder = elementBinder.bindDirective(directiveIndex);
current.compileChildren = current.compileChildren && dirMetadata.compileChildren;
if (isPresent(dirMetadata.properties)) {
ListWrapper.forEach(dirMetadata.properties, (bindConfig) => {
if (isPresent(dirMetadata.inputs)) {
ListWrapper.forEach(dirMetadata.inputs, (bindConfig) => {
this._bindDirectiveProperty(bindConfig, current, directiveBinderBuilder);
});
}

8
modules/angular2/src/mock/directive_resolver_mock.ts
View File

@ -26,8 +26,8 @@ export class MockDirectiveResolver extends DirectiveResolver {
return new ComponentMetadata({
selector: dm.selector,
properties: dm.properties,
events: dm.events,
inputs: dm.inputs,
outputs: dm.outputs,
host: dm.host,
bindings: bindings,
exportAs: dm.exportAs,
@ -41,8 +41,8 @@ export class MockDirectiveResolver extends DirectiveResolver {
return new DirectiveMetadata({
selector: dm.selector,
properties: dm.properties,
events: dm.events,
inputs: dm.inputs,
outputs: dm.outputs,
host: dm.host,
bindings: bindings,
exportAs: dm.exportAs,

2
modules/angular2/src/router/router_link.ts
View File

@ -36,7 +36,7 @@ import {Instruction, stringifyInstruction} from './instruction';
*/
@Directive({
selector: '[router-link]',
properties: ['routeParams: routerLink'],
inputs: ['routeParams: routerLink'],
host: {
'(click)': 'onClick()',
'[attr.href]': 'visibleHref',

8
modules/angular2/src/web_workers/shared/serializer.ts
View File

@ -367,8 +367,8 @@ export class Serializer {
'id': meta.id,
'selector': meta.selector,
'compileChildren': meta.compileChildren,
'events': meta.events,
'properties': meta.properties,
'events': meta.outputs,
'inputs': meta.inputs,
'readAttributes': meta.readAttributes,
'type': meta.type,
'callOnDestroy': meta.callOnDestroy,
@ -392,7 +392,7 @@ export class Serializer {
hostProperties: this.objectToMap(obj['hostProperties']),
hostListeners: this.objectToMap(obj['hostListeners']),
hostAttributes: this.objectToMap(obj['hostAttributes']),
properties: obj['properties'],
inputs: obj['inputs'],
readAttributes: obj['readAttributes'],
type: obj['type'],
exportAs: obj['exportAs'],
@ -402,7 +402,7 @@ export class Serializer {
callOnInit: obj['callOnInit'],
callAfterContentChecked: obj['callAfterContentChecked'],
changeDetection: obj['changeDetection'],
events: obj['events']
outputs: obj['events']
});
}
}