honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(compiler): added the DynamicComponent annotation

This commit is contained in:
vsavkin 2015-03-13 11:33:57 -07:00
parent 1872b03fb8
commit b69f3043e0
8 changed files with 90 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
modules/angular2/src/core/annotations/annotations.js vendored
View File

@ -233,6 +233,40 @@ export class Component extends Directive {
}
}
/**
* @publicModule angular2/angular2
*/
export class DynamicComponent extends Directive {
services:any; //List;
@CONST()
constructor({
selector,
bind,
events,
services,
implementsTypes,
lifecycle
}:{
selector:string,
bind:any,
events:any,
services:List,
implementsTypes:List,
lifecycle:List
}={}) {
super({
selector: selector,
bind: bind,
events: events,
implementsTypes: implementsTypes,
lifecycle: lifecycle
});
this.services = services;
}
}
/**
* @publicModule angular2/angular2
*/

2
modules/angular2/src/core/compiler/compiler.js vendored
View File

@ -163,7 +163,7 @@ export class Compiler {
var nestedPVPromises = [];
for (var i = 0; i < compileElements.length; i++) {
var ce = compileElements[i];
if (isPresent(ce.componentDirective)) {
if (ce.hasNestedView) {
this._compileNestedProtoView(ce, nestedPVPromises);
}
}

7
modules/angular2/src/core/compiler/pipeline/compile_element.js vendored
View File

@ -2,7 +2,7 @@ import {List, Map, ListWrapper, MapWrapper} from 'angular2/src/facade/collection
import {DOM} from 'angular2/src/dom/dom_adapter';
import {int, isBlank, isPresent, Type, StringJoiner, assertionsEnabled} from 'angular2/src/facade/lang';
import {DirectiveMetadata} from '../directive_metadata';
import {Decorator, Component, Viewport} from '../../annotations/annotations';
import {Decorator, Component, Viewport, DynamicComponent} from '../../annotations/annotations';
import {ElementBinder} from '../element_binder';
import {ProtoElementInjector} from '../element_injector';
import {ProtoView} from '../view';
@ -30,6 +30,7 @@ export class CompileElement {
decoratorDirectives:List<DirectiveMetadata>;
viewportDirective:DirectiveMetadata;
componentDirective:DirectiveMetadata;
hasNestedView:boolean;
_allDirectives:List<DirectiveMetadata>;
isViewRoot:boolean;
hasBindings:boolean;
@ -54,6 +55,7 @@ export class CompileElement {
this.decoratorDirectives = null;
this.viewportDirective = null;
this.componentDirective = null;
this.hasNestedView = false;
this._allDirectives = null;
this.isViewRoot = false;
this.hasBindings = false;
@ -157,6 +159,9 @@ export class CompileElement {
this.viewportDirective = directive;
} else if (annotation instanceof Component) {
this.componentDirective = directive;
this.hasNestedView = true;
} else if (annotation instanceof DynamicComponent) {
this.componentDirective = directive;
}
}

8
modules/angular2/src/core/compiler/pipeline/directive_parser.js vendored
View File

@ -5,7 +5,7 @@ import {SelectorMatcher} from '../selector';
import {CssSelector} from '../selector';
import {DirectiveMetadata} from '../directive_metadata';
import {Component, Viewport} from '../../annotations/annotations';
import {DynamicComponent, Component, Viewport} from '../../annotations/annotations';
import {CompileStep} from './compile_step';
import {CompileElement} from './compile_element';
import {CompileControl} from './compile_control';
@ -109,6 +109,9 @@ function updateMatchedProperties(matchedProperties, selector, directive) {
// check if the directive is compatible with the current element
function checkDirectiveValidity(directive, current, isTemplateElement) {
var isComponent = directive.annotation instanceof Component || directive.annotation instanceof DynamicComponent;
var alreadyHasComponent = isPresent(current.componentDirective);
if (directive.annotation instanceof Viewport) {
if (!isTemplateElement) {
throw new BaseException(`Viewport directives need to be placed on <template> elements or elements ` +
@ -118,7 +121,8 @@ function checkDirectiveValidity(directive, current, isTemplateElement) {
}
} else if (isTemplateElement) {
throw new BaseException(`Only template directives are allowed on template elements - check ${current.elementDescription}`);
} else if ((directive.annotation instanceof Component) && isPresent(current.componentDirective)) {
} else if (isComponent && alreadyHasComponent) {
throw new BaseException(`Multiple component directives not allowed on the same element - check ${current.elementDescription}`);
}
}

4
modules/angular2/src/core/compiler/view.js vendored
View File

@ -171,7 +171,7 @@ export class View {
}
}
if (isPresent(componentDirective)) {
if (isPresent(binders[i].nestedProtoView) && isPresent(componentDirective)) {
this.componentChildViews[componentChildViewIndex++].hydrate(shadowDomAppInjector,
elementInjector, this.lightDoms[i], elementInjector.getComponent(), null);
}
@ -441,7 +441,7 @@ export class ProtoView {
// componentChildViews
var lightDom = null;
var bindingPropagationConfig = null;
if (isPresent(binder.componentDirective)) {
if (isPresent(binder.nestedProtoView) && isPresent(binder.componentDirective)) {
var strategy = this.shadowDomStrategy;
var childView = binder.nestedProtoView.instantiate(elementInjector, eventManager);
changeDetector.addChild(childView.changeDetector);

3
modules/angular2/test/core/compiler/compiler_common_tests.js vendored
View File

@ -114,6 +114,7 @@ export function runCompilerCommonTests() {
var compiler = createCompiler( (parent, current, control) => {
if (DOM.hasClass(current.element, 'nested')) {
current.componentDirective = reader.read(NestedComponent);
current.hasNestedView = true;
current.inheritedProtoView = parent.inheritedProtoView;
current.inheritedElementBinder = current.inheritedProtoView.bindElement(null, 0, null);
} else {
@ -163,6 +164,7 @@ export function runCompilerCommonTests() {
it('should allow recursive components', inject([AsyncTestCompleter], (async) => {
var compiler = createCompiler( (parent, current, control) => {
current.hasNestedView = true;
current.inheritedProtoView = new ProtoView(current.element, null, null);
current.inheritedElementBinder = current.inheritedProtoView.bindElement(null, 0, null);
current.componentDirective = reader.read(RecursiveComponent);
@ -191,6 +193,7 @@ export function runCompilerCommonTests() {
var compiler = createCompiler((parent, current, control) => {
if (DOM.hasClass(current.element, 'parent')) {
current.hasNestedView = true;
current.componentDirective = reader.read(NestedComponent);
current.inheritedProtoView = parent.inheritedProtoView;
current.inheritedElementBinder = current.inheritedProtoView.bindElement(null, 0, null);

42
modules/angular2/test/core/compiler/pipeline/directive_parser_spec.js vendored
View File

@ -1,4 +1,4 @@
import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'angular2/test_lib';
import {describe, beforeEach, it, xit, expect, iit, ddescribe, el} from 'angular2/test_lib';
import {isPresent, assertionsEnabled} from 'angular2/src/facade/lang';
import {ListWrapper, MapWrapper, StringMapWrapper} from 'angular2/src/facade/collection';
import {DirectiveParser} from 'angular2/src/core/compiler/pipeline/directive_parser';
@ -6,7 +6,7 @@ import {CompilePipeline} from 'angular2/src/core/compiler/pipeline/compile_pipel
import {CompileStep} from 'angular2/src/core/compiler/pipeline/compile_step';
import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_element';
import {CompileControl} from 'angular2/src/core/compiler/pipeline/compile_control';
import {Component, Decorator, Viewport} from 'angular2/src/core/annotations/annotations';
import {Component, DynamicComponent, Decorator, Viewport} from 'angular2/src/core/annotations/annotations';
import {Template} from 'angular2/src/core/annotations/template';
import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
import {Lexer, Parser} from 'angular2/change_detection';
@ -24,7 +24,9 @@ export function main() {
SomeViewport,
SomeViewport2,
SomeComponent,
SomeComponent2
SomeComponent2,
SomeDynamicComponent,
SomeDynamicComponent2
];
});
@ -105,6 +107,29 @@ export function main() {
});
});
describe("dynamic component directives", () => {
it('should detect dynamic component', () => {
var results = createPipeline().process(el('<div some-dynamic-comp></div>'));
expect(results[0].componentDirective).toEqual(reader.read(SomeDynamicComponent));
});
it('should not allow multiple dynamic component directives on the same element', () => {
expect( () => {
createPipeline().process(
el('<div some-dynamic-comp some-dynamic-comp2></div>')
);
}).toThrowError(new RegExp('Multiple component directives not allowed on the same element'));
});
it('should not allow component and dynamic directives on the same element', () => {
expect( () => {
createPipeline().process(
el('<div some-dynamic-comp some-comp></div>')
);
}).toThrowError(new RegExp('Multiple component directives not allowed on the same element'));
});
});
describe('viewport directives', () => {
it('should detect them in attributes', () => {
var results = createPipeline().process(el('<template some-templ></template>'));
@ -236,8 +261,17 @@ class SomeComponent {}
@Component({selector: '[some-comp2]'})
class SomeComponent2 {}
@DynamicComponent({selector: '[some-dynamic-comp]'})
class SomeDynamicComponent {}
@DynamicComponent({selector: '[some-dynamic-comp2]'})
class SomeDynamicComponent2 {}
@Component()
@Template({
directives: [SomeDecorator, SomeViewport, SomeViewport2, SomeComponent, SomeComponent2]
directives: [SomeDecorator, SomeViewport, SomeViewport2,
SomeComponent, SomeComponent2,
SomeDynamicComponent, SomeDynamicComponent2
]
})
class MyComp {}

1
modules/angular2/test/core/compiler/pipeline/element_binding_marker_spec.js vendored
View File

@ -101,7 +101,6 @@ export function main() {
}).process(el('<div></div>'));
assertBinding(results[0], true);
});
});
}