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

feat(Directive): Have a single Directive.host which mimics HTML

Browse Source 
fixes #2268

BREAKING CHANGE:

Before

    @Directive({
      hostListeners: {'event': 'statement'},
      hostProperties: {'expression': 'hostProp'},
      hostAttributes: {'attr': 'value'},
      hostActions: {'action': 'statement'}
    })

After

    @Directive({
      host: {
        '(event)': 'statement',
        '[hostProp]': 'expression'  // k & v swapped
        'attr': 'value',
        '@action': 'statement'
      }
    })
This commit is contained in:
Victor Berchet
2015-06-09 12:33:40 +02:00
committed by Tobias Bosch
parent 47b6b05017
commit f3b49378e4
32 changed files with 316 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
modules/angular2/test/core/compiler/compiler_spec.ts
View File

@ -210,7 +210,7 @@ export function main() {
captureDirective(DirectiveWithProperties)
.then((renderDir) => {
expect(renderDir.hostProperties)
.toEqual(MapWrapper.createFromStringMap({'someField': 'someProp'}));
.toEqual(MapWrapper.createFromStringMap({'someProp': 'someExp'}));
async.done();
});
}));
@ -470,11 +470,11 @@ class SomeDirective {
class IgnoreChildrenDirective {
}
@Directive({hostListeners: {'someEvent': 'someAction'}})
@Directive({host: {'(someEvent)': 'someAction'}})
class DirectiveWithEvents {
}
@Directive({hostProperties: {'someField': 'someProp'}})
@Directive({host: {'[someProp]': 'someExp'}})
class DirectiveWithProperties {
}

2
modules/angular2/test/core/compiler/dynamic_component_loader_spec.ts
View File

@ -303,7 +303,7 @@ class DynamicallyLoaded {
class DynamicallyLoaded2 {
}
@Component({selector: 'dummy', hostProperties: {'id': 'id'}})
@Component({selector: 'dummy', host: {'[id]': 'id'}})
@View({template: "DynamicallyLoadedWithHostProps;"})
class DynamicallyLoadedWithHostProps {
id: string;

2
modules/angular2/test/core/compiler/element_injector_spec.ts
View File

@ -432,7 +432,7 @@ export function main() {
it('should return a list of hostAction accessors', () => {
var binding = DirectiveBinding.createFromType(
HasEventEmitter, new dirAnn.Directive({hostActions: {'hostActionName': 'onAction'}}));
HasEventEmitter, new dirAnn.Directive({host: {'@hostActionName': 'onAction'}}));
var inj = createPei(null, 0, [binding]);
expect(inj.hostActionAccessors.length).toEqual(1);

26
modules/angular2/test/core/compiler/integration_spec.ts
View File

@ -1432,12 +1432,12 @@ class DirectiveEmitingEvent {
fireEvent(msg: string) { ObservableWrapper.callNext(this.event, msg); }
}
@Directive({selector: '[update-host-attributes]', hostAttributes: {'role': 'button'}})
@Directive({selector: '[update-host-attributes]', host: {'role': 'button'}})
@Injectable()
class DirectiveUpdatingHostAttributes {
}
@Directive({selector: '[update-host-properties]', hostProperties: {'id': 'id'}})
@Directive({selector: '[update-host-properties]', host: {'[id]': 'id'}})
@Injectable()
class DirectiveUpdatingHostProperties {
id: string;
@ -1447,7 +1447,7 @@ class DirectiveUpdatingHostProperties {
@Directive({
selector: '[update-host-actions]',
hostActions: {'setAttr': 'setAttribute("key", $action["attrValue"])'}
host: {'@setAttr': 'setAttribute("key", $action["attrValue"])'}
})
@Injectable()
class DirectiveUpdatingHostActions {
@ -1458,7 +1458,7 @@ class DirectiveUpdatingHostActions {
triggerSetAttr(attrValue) { ObservableWrapper.callNext(this.setAttr, {'attrValue': attrValue}); }
}
@Directive({selector: '[listener]', hostListeners: {'event': 'onEvent($event)'}})
@Directive({selector: '[listener]', host: {'(event)': 'onEvent($event)'}})
@Injectable()
class DirectiveListeningEvent {
msg: string;
@ -1470,11 +1470,11 @@ class DirectiveListeningEvent {
@Directive({
selector: '[listener]',
hostListeners: {
'domEvent': 'onEvent($event.type)',
'window:domEvent': 'onWindowEvent($event.type)',
'document:domEvent': 'onDocumentEvent($event.type)',
'body:domEvent': 'onBodyEvent($event.type)'
host: {
'(domEvent)': 'onEvent($event.type)',
'(window:domEvent)': 'onWindowEvent($event.type)',
'(document:domEvent)': 'onDocumentEvent($event.type)',
'(body:domEvent)': 'onBodyEvent($event.type)'
}
})
@Injectable()
@ -1489,7 +1489,7 @@ class DirectiveListeningDomEvent {
var globalCounter = 0;
@Directive(
{selector: '[listenerother]', hostListeners: {'window:domEvent': 'onEvent($event.type)'}})
{selector: '[listenerother]', host: {'(window:domEvent)': 'onEvent($event.type)'}})
@Injectable()
class DirectiveListeningDomEventOther {
eventType: string;
@ -1501,13 +1501,13 @@ class DirectiveListeningDomEventOther {
}
}
@Directive({selector: '[listenerprevent]', hostListeners: {'click': 'onEvent($event)'}})
@Directive({selector: '[listenerprevent]', host: {'(click)': 'onEvent($event)'}})
@Injectable()
class DirectiveListeningDomEventPrevent {
onEvent(event) { return false; }
}
@Directive({selector: '[listenernoprevent]', hostListeners: {'click': 'onEvent($event)'}})
@Directive({selector: '[listenernoprevent]', host: {'(click)': 'onEvent($event)'}})
@Injectable()
class DirectiveListeningDomEventNoPrevent {
onEvent(event) { return true; }
@ -1749,4 +1749,4 @@ class SomeImperativeViewport {
@Directive({selector: '[export-dir]', exportAs: 'dir'})
class ExportDir {
}
}

16
modules/angular2/test/core/compiler/proto_view_factory_spec.ts
View File

@ -76,9 +76,9 @@ export function main() {
{variableBindings: MapWrapper.createFromStringMap({"exportName": "templateName"})}),
[
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})}),
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})}),
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'otherName'})})
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'otherName'})})
]);
expect(dvbs).toEqual(MapWrapper.createFromStringMap({"templateName": 0}));
@ -90,7 +90,7 @@ export function main() {
{variableBindings: MapWrapper.createFromStringMap({"$implicit": "templateName"})}),
[
directiveBinding({
metadata: new renderApi.DirectiveMetadata(
metadata: renderApi.DirectiveMetadata.create(
{exportAs: null, type: renderApi.DirectiveMetadata.COMPONENT_TYPE})
})
]);
@ -107,7 +107,7 @@ export function main() {
}),
[
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})})
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})})
]);
}).toThrowError(new RegExp("Cannot find directive with exportAs = 'someInvalidName'"));
});
@ -120,9 +120,9 @@ export function main() {
}),
[
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})}),
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})}),
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})})
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})})
]);
}).toThrowError(new RegExp("More than one directive have exportAs = 'exportName'"));
});
@ -132,9 +132,9 @@ export function main() {
createDirectiveVariableBindings(
new renderApi.ElementBinder({variableBindings: MapWrapper.create()}), [
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})}),
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})}),
directiveBinding(
{metadata: new renderApi.DirectiveMetadata({exportAs: 'exportName'})})
{metadata: renderApi.DirectiveMetadata.create({exportAs: 'exportName'})})
]);
}).not.toThrow();
});