diff --git a/modules/angular2/src/core/compiler/template_parser.ts b/modules/angular2/src/core/compiler/template_parser.ts index 4331b78ee5..c68991f962 100644 --- a/modules/angular2/src/core/compiler/template_parser.ts +++ b/modules/angular2/src/core/compiler/template_parser.ts @@ -361,7 +361,8 @@ class TemplateParseVisitor implements HtmlAstVisitor { private _parseAssignmentEvent(name: string, expression: string, sourceInfo: string, targetMatchableAttrs: string[][], targetEvents: BoundEventAst[]) { - this._parseEvent(name, `${expression}=$event`, sourceInfo, targetMatchableAttrs, targetEvents); + this._parseEvent(`${name}-change`, `${expression}=$event`, sourceInfo, targetMatchableAttrs, + targetEvents); } private _parseEvent(name: string, expression: string, sourceInfo: string, diff --git a/modules/angular2/src/core/forms/directives/ng_control_name.ts b/modules/angular2/src/core/forms/directives/ng_control_name.ts index 9f96610082..3578776827 100644 --- a/modules/angular2/src/core/forms/directives/ng_control_name.ts +++ b/modules/angular2/src/core/forms/directives/ng_control_name.ts @@ -75,7 +75,7 @@ const controlNameBinding = selector: '[ng-control]', bindings: [controlNameBinding], inputs: ['name: ngControl', 'model: ngModel'], - outputs: ['update: ngModel'], + outputs: ['update: ngModelChange'], exportAs: 'form' }) export class NgControlName extends NgControl implements OnChanges, diff --git a/modules/angular2/src/core/forms/directives/ng_form_control.ts b/modules/angular2/src/core/forms/directives/ng_form_control.ts index b52ff6c766..a896d2b410 100644 --- a/modules/angular2/src/core/forms/directives/ng_form_control.ts +++ b/modules/angular2/src/core/forms/directives/ng_form_control.ts @@ -66,7 +66,7 @@ const formControlBinding = selector: '[ng-form-control]', bindings: [formControlBinding], inputs: ['form: ngFormControl', 'model: ngModel'], - outputs: ['update: ngModel'], + outputs: ['update: ngModelChange'], exportAs: 'form' }) export class NgFormControl extends NgControl implements OnChanges { diff --git a/modules/angular2/src/core/forms/directives/ng_model.ts b/modules/angular2/src/core/forms/directives/ng_model.ts index 049641ad9a..427c34afc2 100644 --- a/modules/angular2/src/core/forms/directives/ng_model.ts +++ b/modules/angular2/src/core/forms/directives/ng_model.ts @@ -37,7 +37,7 @@ const formControlBinding = CONST_EXPR(new Binding(NgControl, {toAlias: forwardRe selector: '[ng-model]:not([ng-control]):not([ng-form-control])', bindings: [formControlBinding], inputs: ['model: ngModel'], - outputs: ['update: ngModel'], + outputs: ['update: ngModelChange'], exportAs: 'form' }) export class NgModel extends NgControl implements OnChanges { diff --git a/modules/angular2/test/core/compiler/template_parser_spec.ts b/modules/angular2/test/core/compiler/template_parser_spec.ts index 58b6d3833d..277555503b 100644 --- a/modules/angular2/test/core/compiler/template_parser_spec.ts +++ b/modules/angular2/test/core/compiler/template_parser_spec.ts @@ -282,7 +282,7 @@ export function main() { ], [ BoundEventAst, - 'prop', + 'propChange', null, 'v = $event', 'TestComp > div:nth-child(0)[[(prop)]=v]' @@ -305,7 +305,7 @@ export function main() { ], [ BoundEventAst, - 'prop', + 'propChange', null, 'v = $event', 'TestComp > div:nth-child(0)[bindon-prop=v]' diff --git a/modules/angular2/test/core/linker/integration_spec.ts b/modules/angular2/test/core/linker/integration_spec.ts index 7410e2123a..34fc789f8c 100644 --- a/modules/angular2/test/core/linker/integration_spec.ts +++ b/modules/angular2/test/core/linker/integration_spec.ts @@ -839,9 +839,9 @@ export function main() { rootTC.debugElement.componentInstance.ctxProp = 'one'; rootTC.detectChanges(); - expect(dir.value).toEqual('one'); + expect(dir.control).toEqual('one'); - ObservableWrapper.subscribe(dir.control, (_) => { + ObservableWrapper.subscribe(dir.controlChange, (_) => { expect(rootTC.debugElement.componentInstance.ctxProp).toEqual('two'); async.done(); }); @@ -2072,15 +2072,13 @@ class ToolbarComponent { } } -@Directive({selector: '[two-way]', inputs: ['value: control'], outputs: ['control']}) +@Directive({selector: '[two-way]', inputs: ['control'], outputs: ['controlChange']}) @Injectable() class DirectiveWithTwoWayBinding { - control: EventEmitter; - value: any; + controlChange = new EventEmitter(); + control = null; - constructor() { this.control = new EventEmitter(); } - - triggerChange(value) { ObservableWrapper.callNext(this.control, value); } + triggerChange(value) { ObservableWrapper.callNext(this.controlChange, value); } } @Injectable() diff --git a/modules/upgrade/src/ng1_facade.ts b/modules/upgrade/src/ng1_facade.ts index 87d4d8ffdd..e42619e40b 100644 --- a/modules/upgrade/src/ng1_facade.ts +++ b/modules/upgrade/src/ng1_facade.ts @@ -63,6 +63,7 @@ export class ExportedNg1Component { localName = localName.substr(1) || name; var outputName = 'output_' + name; var outputNameRename = outputName + ': ' + name; + var outputNameRenameChange = outputName + ': ' + name + 'Change'; var inputName = 'input_' + name; var inputNameRename = inputName + ': ' + name; switch (type) { @@ -70,7 +71,7 @@ export class ExportedNg1Component { this.propertyOutputs.push(outputName); this.checkProperties.push(localName); this.outputs.push(outputName); - this.outputsRename.push(outputNameRename); + this.outputsRename.push(outputNameRenameChange); this.propertyMap[outputName] = localName; // don't break; let it fall through to '@' case '@': diff --git a/modules/upgrade/src/ng2_facade.ts b/modules/upgrade/src/ng2_facade.ts index c3cd6f3e09..e043282065 100644 --- a/modules/upgrade/src/ng2_facade.ts +++ b/modules/upgrade/src/ng2_facade.ts @@ -120,15 +120,23 @@ export class Ng2ComponentFacade { var output = outputs[j]; var expr = null; var assignExpr = false; + + var bindonAttr = + output.bindonAttr ? output.bindonAttr.substring(0, output.bindonAttr.length - 6) : null; + var bracketParenAttr = + output.bracketParenAttr ? + `[(${output.bracketParenAttr.substring(2, output.bracketParenAttr.length - 8)})]` : + null; + if (attrs.hasOwnProperty(output.onAttr)) { expr = attrs[output.onAttr]; } else if (attrs.hasOwnProperty(output.parenAttr)) { expr = attrs[output.parenAttr]; - } else if (attrs.hasOwnProperty(output.bindonAttr)) { - expr = attrs[output.bindonAttr]; + } else if (attrs.hasOwnProperty(bindonAttr)) { + expr = attrs[bindonAttr]; assignExpr = true; - } else if (attrs.hasOwnProperty(output.bracketParenAttr)) { - expr = attrs[output.bracketParenAttr]; + } else if (attrs.hasOwnProperty(bracketParenAttr)) { + expr = attrs[bracketParenAttr]; assignExpr = true; } diff --git a/modules/upgrade/test/integration_spec.ts b/modules/upgrade/test/integration_spec.ts index 6a757f3041..76b55ca510 100644 --- a/modules/upgrade/test/integration_spec.ts +++ b/modules/upgrade/test/integration_spec.ts @@ -111,8 +111,12 @@ export function main() { Component({ selector: 'ng2', inputs: ['literal', 'interpolate', 'oneWayA', 'oneWayB', 'twoWayA', 'twoWayB'], - outputs: - ['eventA', 'eventB', 'twoWayAEmitter: twoWayA', 'twoWayBEmitter: twoWayB'] + outputs: [ + 'eventA', + 'eventB', + 'twoWayAEmitter: twoWayAChange', + 'twoWayBEmitter: twoWayBChange' + ] }) .View({ template: