From 56f4e84d45d1cbbc9cf88a34535950485abf110e Mon Sep 17 00:00:00 2001 From: Pawel Kozlowski Date: Tue, 17 Feb 2015 21:55:18 +0100 Subject: [PATCH] fix: flip attr / property bind in directives annotations Fixes #648 Closes #684 --- modules/angular2/docs/core/02_directives.md | 4 ++-- .../pipeline/element_binder_builder.js | 2 +- modules/angular2/src/directives/foreach.js | 2 +- modules/angular2/src/directives/if.js | 2 +- modules/angular2/src/directives/switch.js | 4 ++-- modules/angular2/src/forms/directives.js | 8 ++++---- .../test/core/compiler/integration_spec.js | 2 +- .../pipeline/element_binder_builder_spec.js | 10 +++++----- .../src/compiler/compiler_benchmark.js | 20 +++++++++---------- .../src/naive_infinite_scroll/cells.js | 12 +++++------ .../src/naive_infinite_scroll/index.js | 4 ++-- modules/benchmarks/src/tree/tree_benchmark.js | 2 +- 12 files changed, 36 insertions(+), 36 deletions(-) diff --git a/modules/angular2/docs/core/02_directives.md b/modules/angular2/docs/core/02_directives.md index 79680b0df2..7756985d6d 100644 --- a/modules/angular2/docs/core/02_directives.md +++ b/modules/angular2/docs/core/02_directives.md @@ -68,7 +68,7 @@ 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 - tooltip: 'text' // - DOM element tooltip property should be + text: 'tooltip' // - DOM element tooltip property should be }, // mapped to the directive text property. event: { // List which events need to be mapped. mouseover: 'show' // - Invoke the show() method every time @@ -180,7 +180,7 @@ Viewport is a directive which can control instantiation of child views which are @Viewport({ selector: '[if]', bind: { - 'if': 'condition' + 'condition': 'if' } }) export class If { diff --git a/modules/angular2/src/core/compiler/pipeline/element_binder_builder.js b/modules/angular2/src/core/compiler/pipeline/element_binder_builder.js index 6f327d66cf..84532dd849 100644 --- a/modules/angular2/src/core/compiler/pipeline/element_binder_builder.js +++ b/modules/angular2/src/core/compiler/pipeline/element_binder_builder.js @@ -196,7 +196,7 @@ export class ElementBinderBuilder extends CompileStep { var annotation = directive.annotation; if (isBlank(annotation.bind)) continue; var _this = this; - StringMapWrapper.forEach(annotation.bind, function (dirProp, elProp) { + StringMapWrapper.forEach(annotation.bind, function (elProp, dirProp) { var expression = isPresent(compileElement.propertyBindings) ? MapWrapper.get(compileElement.propertyBindings, elProp) : null; diff --git a/modules/angular2/src/directives/foreach.js b/modules/angular2/src/directives/foreach.js index 858330b6f5..09b1b770fd 100644 --- a/modules/angular2/src/directives/foreach.js +++ b/modules/angular2/src/directives/foreach.js @@ -7,7 +7,7 @@ import {ListWrapper} from 'angular2/src/facade/collection'; @Viewport({ selector: '[foreach][in]', bind: { - 'in': 'iterableChanges[]' + 'iterableChanges[]': 'in' } }) export class Foreach { diff --git a/modules/angular2/src/directives/if.js b/modules/angular2/src/directives/if.js index adb7506065..0f108c06db 100644 --- a/modules/angular2/src/directives/if.js +++ b/modules/angular2/src/directives/if.js @@ -5,7 +5,7 @@ import {isBlank} from 'angular2/src/facade/lang'; @Viewport({ selector: '[if]', bind: { - 'if': 'condition' + 'condition': 'if' } }) export class If { diff --git a/modules/angular2/src/directives/switch.js b/modules/angular2/src/directives/switch.js index bd4874f8db..a706a1ea39 100644 --- a/modules/angular2/src/directives/switch.js +++ b/modules/angular2/src/directives/switch.js @@ -33,7 +33,7 @@ import {Parent} from 'angular2/src/core/annotations/visibility'; @Decorator({ selector: '[switch]', bind: { - 'switch': 'value' + 'value': 'switch' } }) export class Switch { @@ -144,7 +144,7 @@ export class Switch { @Viewport({ selector: '[switch-when]', bind: { - 'switch-when' : 'when' + 'when' : 'switch-when' } }) export class SwitchWhen { diff --git a/modules/angular2/src/forms/directives.js b/modules/angular2/src/forms/directives.js index 987d26127c..8b676ed37b 100644 --- a/modules/angular2/src/forms/directives.js +++ b/modules/angular2/src/forms/directives.js @@ -99,7 +99,7 @@ export class ControlDirectiveBase { lifecycle: [onChange], selector: '[control-name]', bind: { - 'control-name' : 'controlName', + 'controlName' : 'control-name', 'type' : 'type' } }) @@ -117,7 +117,7 @@ export class ControlNameDirective extends ControlDirectiveBase { lifecycle: [onChange], selector: '[control]', bind: { - 'control' : 'controlName', + 'controlName' : 'control', 'type' : 'type' } }) @@ -134,7 +134,7 @@ export class ControlDirective extends ControlDirectiveBase { @Decorator({ selector: '[control-group]', bind: { - 'control-group' : 'controlGroup' + 'controlGroup' : 'control-group' } }) export class ControlGroupDirective extends ControlGroupDirectiveBase { @@ -163,7 +163,7 @@ export class ControlGroupDirective extends ControlGroupDirectiveBase { @Component({ selector: '[new-control-group]', bind: { - 'new-control-group' : 'initData' + 'initData' : 'new-control-group' } }) @Template({inline: ''}) diff --git a/modules/angular2/test/core/compiler/integration_spec.js b/modules/angular2/test/core/compiler/integration_spec.js index bc29590e36..0f88d648a5 100644 --- a/modules/angular2/test/core/compiler/integration_spec.js +++ b/modules/angular2/test/core/compiler/integration_spec.js @@ -288,7 +288,7 @@ export function main() { @Decorator({ selector: '[my-dir]', - bind: {'elprop':'dirProp'} + bind: {'dirProp':'elprop'} }) class MyDir { dirProp:string; diff --git a/modules/angular2/test/core/compiler/pipeline/element_binder_builder_spec.js b/modules/angular2/test/core/compiler/pipeline/element_binder_builder_spec.js index 443f202361..4abb59c093 100644 --- a/modules/angular2/test/core/compiler/pipeline/element_binder_builder_spec.js +++ b/modules/angular2/test/core/compiler/pipeline/element_binder_builder_spec.js @@ -448,7 +448,7 @@ class SomeDecoratorDirective { } @Decorator({ - bind: {'boundprop1': 'decorProp'} + bind: {'decorProp': 'boundprop1'} }) class SomeDecoratorDirectiveWithBinding { decorProp; @@ -461,8 +461,8 @@ class SomeDecoratorDirectiveWithBinding { @Decorator({ bind: { - 'boundprop1': 'decorProp', - 'boundprop2': 'decorProp2' + 'decorProp': 'boundprop1', + 'decorProp2': 'boundprop2' } }) class SomeDecoratorDirectiveWith2Bindings { @@ -479,7 +479,7 @@ class SomeViewportDirective { } @Viewport({ - bind: {'boundprop2': 'templProp'} + bind: {'templProp': 'boundprop2'} }) class SomeViewportDirectiveWithBinding { templProp; @@ -492,7 +492,7 @@ class SomeViewportDirectiveWithBinding { class SomeComponentDirective { } -@Component({bind: {'boundprop3': 'compProp'}}) +@Component({bind: {'compProp': 'boundprop3'}}) class SomeComponentDirectiveWithBinding { compProp; constructor() { diff --git a/modules/benchmarks/src/compiler/compiler_benchmark.js b/modules/benchmarks/src/compiler/compiler_benchmark.js index 5134b1e023..3ea9c85d67 100644 --- a/modules/benchmarks/src/compiler/compiler_benchmark.js +++ b/modules/benchmarks/src/compiler/compiler_benchmark.js @@ -28,31 +28,31 @@ function setupReflector() { reflector.registerType(Dir0, { "factory": () => new Dir0(), "parameters": [], - "annotations" : [new Decorator({selector: '[dir0]', bind: {'attr0': 'prop'}})] + "annotations" : [new Decorator({selector: '[dir0]', bind: {'prop': 'attr0'}})] }); reflector.registerType(Dir1, { "factory": (dir0) => new Dir1(dir0), "parameters": [[Dir0]], - "annotations" : [new Decorator({selector: '[dir1]', bind: {'attr1': 'prop'}})] + "annotations" : [new Decorator({selector: '[dir1]', bind: {'prop': 'attr1'}})] }); reflector.registerType(Dir2, { "factory": (dir1) => new Dir2(dir1), "parameters": [[Dir1]], - "annotations" : [new Decorator({selector: '[dir2]', bind: {'attr2': 'prop'}})] + "annotations" : [new Decorator({selector: '[dir2]', bind: {'prop': 'attr2'}})] }); reflector.registerType(Dir3, { "factory": (dir2) => new Dir3(dir2), "parameters": [[Dir2]], - "annotations" : [new Decorator({selector: '[dir3]', bind: {'attr3': 'prop'}})] + "annotations" : [new Decorator({selector: '[dir3]', bind: {'prop': 'attr3'}})] }); reflector.registerType(Dir4, { "factory": (dir3) => new Dir4(dir3), "parameters": [[Dir3]], - "annotations" : [new Decorator({selector: '[dir4]', bind: {'attr4': 'prop'}})] + "annotations" : [new Decorator({selector: '[dir4]', bind: {'prop': 'attr4'}})] }); reflector.registerGetters({ @@ -117,7 +117,7 @@ function createTemplateHtml(templateId, repeatCount) { @Decorator({ selector: '[dir0]', bind: { - 'attr0': 'prop' + 'prop': 'attr0' } }) class Dir0 {} @@ -125,7 +125,7 @@ class Dir0 {} @Decorator({ selector: '[dir1]', bind: { - 'attr1': 'prop' + 'prop': 'attr1' } }) class Dir1 { @@ -135,7 +135,7 @@ class Dir1 { @Decorator({ selector: '[dir2]', bind: { - 'attr2': 'prop' + 'prop': 'attr2' } }) class Dir2 { @@ -145,7 +145,7 @@ class Dir2 { @Decorator({ selector: '[dir3]', bind: { - 'attr3': 'prop' + 'prop': 'attr3' } }) class Dir3 { @@ -155,7 +155,7 @@ class Dir3 { @Decorator({ selector: '[dir4]', bind: { - 'attr4': 'prop' + 'prop': 'attr4' } }) class Dir4 { diff --git a/modules/benchmarks/src/naive_infinite_scroll/cells.js b/modules/benchmarks/src/naive_infinite_scroll/cells.js index 921e5646d2..2a1c391fd6 100644 --- a/modules/benchmarks/src/naive_infinite_scroll/cells.js +++ b/modules/benchmarks/src/naive_infinite_scroll/cells.js @@ -104,7 +104,7 @@ export function setupReflectorForCells() { new Component({ selector: 'company-name', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'company': 'company' } }), @@ -122,7 +122,7 @@ export function setupReflectorForCells() { new Component({ selector: 'opportunity-name', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'opportunity': 'opportunity' } }), @@ -140,7 +140,7 @@ export function setupReflectorForCells() { new Component({ selector: 'offering-name', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'offering': 'offering' } }), @@ -158,7 +158,7 @@ export function setupReflectorForCells() { new Component({ selector: 'stage-buttons', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'offering': 'offering' } }), @@ -184,7 +184,7 @@ export function setupReflectorForCells() { new Component({ selector: 'account-cell', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'account': 'account' } }), @@ -207,7 +207,7 @@ export function setupReflectorForCells() { new Component({ selector: 'formatted-cell', bind: { - 'cell-width': 'width', + 'width': 'cell-width', 'value': 'value' } }), diff --git a/modules/benchmarks/src/naive_infinite_scroll/index.js b/modules/benchmarks/src/naive_infinite_scroll/index.js index b50dc9d061..bb827d7cef 100644 --- a/modules/benchmarks/src/naive_infinite_scroll/index.js +++ b/modules/benchmarks/src/naive_infinite_scroll/index.js @@ -158,7 +158,7 @@ export function setupReflectorForAngular() { 'annotations' : [new Viewport({ selector: '[if]', bind: { - 'if': 'condition' + 'condition': 'if' } })] }); @@ -169,7 +169,7 @@ export function setupReflectorForAngular() { 'annotations' : [new Viewport({ selector: '[foreach]', bind: { - 'in': 'iterableChanges[]' + 'iterableChanges[]': 'in' } })] }); diff --git a/modules/benchmarks/src/tree/tree_benchmark.js b/modules/benchmarks/src/tree/tree_benchmark.js index 0387f9d7b2..d480e0101d 100644 --- a/modules/benchmarks/src/tree/tree_benchmark.js +++ b/modules/benchmarks/src/tree/tree_benchmark.js @@ -54,7 +54,7 @@ function setupReflector() { 'annotations' : [new Viewport({ selector: '[ng-if]', bind: { - 'ng-if': 'ngIf' + 'ngIf': 'ng-if' } })] });