refactor(core): add `Query.read` and remove `DynamicComponentLoader.loadIntoLocation`.

This adds the feature for `@ViewChild`/`@ViewChildren`/`@ContentChild`/`@ContentChildren` to define what to read from the queried element.

E.g. `@ViewChild(`someVar`, read: ViewContainerRef)` will locate the element with a variable `someVar` on it and return a `ViewContainerRef` for it.

Background: With this change, Angular knows exactly at which elements there will be `ViewConainerRef`s as the user has to ask explicitly of them. This simplifies codegen and will make converting Angular templates into server side templates simpler as well.

BREAKING CHANGE:
- `DynamicComponentLoader.loadIntoLocation` has been removed. Use `@ViewChild(‘myVar’, read: ViewContainerRef)` to get hold of a `ViewContainerRef` at an element with variable `myVar`.
- `DynamicComponentLoader.loadNextToLocation` now takes a `ViewContainerRef` instead of an `ElementRef`.
- `AppViewManager` is renamed into `ViewUtils` and is a mere private utility service.
This commit is contained in:
Tobias Bosch 2016-04-18 13:24:42 -07:00
parent c06b0a2371
commit efbd446d18
42 changed files with 608 additions and 717 deletions

View File

@ -13,7 +13,12 @@ import {
isArray
} from 'angular2/src/facade/lang';
import {unimplemented, BaseException} from 'angular2/src/facade/exceptions';
import {StringMapWrapper, MapWrapper, SetWrapper} from 'angular2/src/facade/collection';
import {
StringMapWrapper,
MapWrapper,
SetWrapper,
ListWrapper
} from 'angular2/src/facade/collection';
import {
ChangeDetectionStrategy,
CHANGE_DETECTION_STRATEGY_VALUES
@ -414,17 +419,20 @@ export class CompileQueryMetadata {
descendants: boolean;
first: boolean;
propertyName: string;
read: CompileTokenMetadata;
constructor({selectors, descendants, first, propertyName}: {
constructor({selectors, descendants, first, propertyName, read}: {
selectors?: Array<CompileTokenMetadata>,
descendants?: boolean,
first?: boolean,
propertyName?: string
propertyName?: string,
read?: CompileTokenMetadata
} = {}) {
this.selectors = selectors;
this.descendants = normalizeBool(descendants);
this.first = normalizeBool(first);
this.propertyName = propertyName;
this.read = read;
}
static fromJson(data: {[key: string]: any}): CompileQueryMetadata {
@ -432,7 +440,8 @@ export class CompileQueryMetadata {
selectors: _arrayFromJson(data['selectors'], CompileTokenMetadata.fromJson),
descendants: data['descendants'],
first: data['first'],
propertyName: data['propertyName']
propertyName: data['propertyName'],
read: _objFromJson(data['read'], CompileTokenMetadata.fromJson)
});
}
@ -441,7 +450,8 @@ export class CompileQueryMetadata {
'selectors': _arrayToJson(this.selectors),
'descendants': this.descendants,
'first': this.first,
'propertyName': this.propertyName
'propertyName': this.propertyName,
'read': _objToJson(this.read)
};
}
}

View File

@ -2,6 +2,7 @@ import {CompileIdentifierMetadata, CompileTokenMetadata} from './compile_metadat
import {AppView} from 'angular2/src/core/linker/view';
import {StaticNodeDebugInfo, DebugContext} from 'angular2/src/core/linker/debug_context';
import {
ViewUtils,
flattenNestedViewRenderNodes,
interpolate,
checkBinding
@ -15,7 +16,6 @@ import {
ChangeDetectorState,
ChangeDetectionStrategy
} from 'angular2/src/core/change_detection/change_detection';
import {AppViewManager_} from 'angular2/src/core/linker/view_manager';
import {AppElement} from 'angular2/src/core/linker/element';
import {ElementRef} from 'angular2/src/core/linker/element_ref';
import {ViewContainerRef} from 'angular2/src/core/linker/view_container_ref';
@ -34,7 +34,7 @@ var CD_MODULE_URL = 'asset:angular2/lib/src/core/change_detection/change_detecti
// Reassign the imports to different variables so we can
// define static variables with the name of the import.
// (only needed for Dart).
var impAppViewManager_ = AppViewManager_;
var impViewUtils = ViewUtils;
var impAppView = AppView;
var impDebugContext = DebugContext;
var impAppElement = AppElement;
@ -61,10 +61,10 @@ var impInterpolate = interpolate;
var impCheckBinding = checkBinding;
export class Identifiers {
static AppViewManager_ = new CompileIdentifierMetadata({
name: 'AppViewManager_',
moduleUrl: 'asset:angular2/lib/src/core/linker/view_manager' + MODULE_SUFFIX,
runtime: impAppViewManager_
static ViewUtils = new CompileIdentifierMetadata({
name: 'ViewUtils',
moduleUrl: 'asset:angular2/lib/src/core/linker/view_utils' + MODULE_SUFFIX,
runtime: impViewUtils
});
static AppView = new CompileIdentifierMetadata(
{name: 'AppView', moduleUrl: APP_VIEW_MODULE_URL, runtime: impAppView});

View File

@ -65,28 +65,42 @@ export class ProviderElementContext {
private _seenProviders = new CompileTokenMap<boolean>();
private _allProviders: CompileTokenMap<ProviderAst>;
private _attrs: {[key: string]: string};
private _hasViewContainer: boolean = false;
constructor(private _viewContext: ProviderViewContext, private _parent: ProviderElementContext,
private _isViewRoot: boolean, private _directiveAsts: DirectiveAst[],
attrs: AttrAst[], private _sourceSpan: ParseSourceSpan) {
attrs: AttrAst[], vars: VariableAst[], private _sourceSpan: ParseSourceSpan) {
this._attrs = {};
attrs.forEach((attrAst) => this._attrs[attrAst.name] = attrAst.value);
var directivesMeta = _directiveAsts.map(directiveAst => directiveAst.directive);
this._allProviders =
_resolveProvidersFromDirectives(directivesMeta, _sourceSpan, _viewContext.errors);
this._contentQueries = _getContentQueries(directivesMeta);
var queriedTokens = new CompileTokenMap<boolean>();
this._allProviders.values().forEach(
(provider) => { this._addQueryReadsTo(provider.token, queriedTokens); });
vars.forEach((varAst) => {
var varToken = new CompileTokenMetadata({value: varAst.name});
this._addQueryReadsTo(varToken, queriedTokens);
});
if (isPresent(queriedTokens.get(identifierToken(Identifiers.ViewContainerRef)))) {
this._hasViewContainer = true;
}
// create the providers that we know are eager first
this._allProviders.values().forEach((provider) => {
if (provider.eager || this.isQueried(provider.token)) {
this._getLocalProvider(provider.providerType, provider.token, true);
var eager = provider.eager || isPresent(queriedTokens.get(provider.token));
if (eager) {
this._getOrCreateLocalProvider(provider.providerType, provider.token, true);
}
});
}
afterElement() {
// collect lazy providers
this._allProviders.values().forEach(
(provider) => { this._getLocalProvider(provider.providerType, provider.token, false); });
this._allProviders.values().forEach((provider) => {
this._getOrCreateLocalProvider(provider.providerType, provider.token, false);
});
}
get transformProviders(): ProviderAst[] { return this._transformedProviders.values(); }
@ -101,30 +115,42 @@ export class ProviderElementContext {
return sortedDirectives;
}
private isQueried(token: CompileTokenMetadata): boolean {
get transformedHasViewContainer(): boolean { return this._hasViewContainer; }
private _addQueryReadsTo(token: CompileTokenMetadata, queryReadTokens: CompileTokenMap<boolean>) {
this._getQueriesFor(token).forEach((query) => {
var queryReadToken = isPresent(query.read) ? query.read : token;
if (isBlank(queryReadTokens.get(queryReadToken))) {
queryReadTokens.add(queryReadToken, true);
}
});
}
private _getQueriesFor(token: CompileTokenMetadata): CompileQueryMetadata[] {
var result: CompileQueryMetadata[] = [];
var currentEl: ProviderElementContext = this;
var distance = 0;
var queries: CompileQueryMetadata[];
while (currentEl !== null) {
var localQueries = currentEl._contentQueries.get(token);
if (isPresent(localQueries)) {
if (localQueries.some((query) => query.descendants || distance <= 1)) {
return true;
}
queries = currentEl._contentQueries.get(token);
if (isPresent(queries)) {
ListWrapper.addAll(result, queries.filter((query) => query.descendants || distance <= 1));
}
if (currentEl._directiveAsts.length > 0) {
distance++;
}
currentEl = currentEl._parent;
}
if (isPresent(this._viewContext.viewQueries.get(token))) {
return true;
queries = this._viewContext.viewQueries.get(token);
if (isPresent(queries)) {
ListWrapper.addAll(result, queries);
}
return false;
return result;
}
private _getLocalProvider(requestingProviderType: ProviderAstType, token: CompileTokenMetadata,
eager: boolean): ProviderAst {
private _getOrCreateLocalProvider(requestingProviderType: ProviderAstType,
token: CompileTokenMetadata, eager: boolean): ProviderAst {
var resolvedProvider = this._allProviders.get(token);
if (isBlank(resolvedProvider) ||
((requestingProviderType === ProviderAstType.Directive ||
@ -198,17 +224,19 @@ export class ProviderElementContext {
if (dep.token.equalsTo(identifierToken(Identifiers.Renderer)) ||
dep.token.equalsTo(identifierToken(Identifiers.ElementRef)) ||
dep.token.equalsTo(identifierToken(Identifiers.ChangeDetectorRef)) ||
dep.token.equalsTo(identifierToken(Identifiers.ViewContainerRef)) ||
dep.token.equalsTo(identifierToken(Identifiers.TemplateRef))) {
return dep;
}
if (dep.token.equalsTo(identifierToken(Identifiers.ViewContainerRef))) {
this._hasViewContainer = true;
}
}
// access the injector
if (dep.token.equalsTo(identifierToken(Identifiers.Injector))) {
return dep;
}
// access providers
if (isPresent(this._getLocalProvider(requestingProviderType, dep.token, eager))) {
if (isPresent(this._getOrCreateLocalProvider(requestingProviderType, dep.token, eager))) {
return dep;
}
}
@ -393,11 +421,11 @@ function _getContentQueries(
function _addQueryToTokenMap(map: CompileTokenMap<CompileQueryMetadata[]>,
query: CompileQueryMetadata) {
query.selectors.forEach((selector) => {
var entry = map.get(selector);
query.selectors.forEach((token: CompileTokenMetadata) => {
var entry = map.get(token);
if (isBlank(entry)) {
entry = [];
map.add(selector, entry);
map.add(token, entry);
}
entry.push(query);
});

View File

@ -225,8 +225,8 @@ class CompiledTemplate {
viewFactory: Function = null;
proxyViewFactory: Function;
constructor() {
this.proxyViewFactory = (viewManager, childInjector, contextEl) =>
this.viewFactory(viewManager, childInjector, contextEl);
this.proxyViewFactory = (viewUtils, childInjector, contextEl) =>
this.viewFactory(viewUtils, childInjector, contextEl);
}
init(viewFactory: Function) { this.viewFactory = viewFactory; }

View File

@ -295,7 +295,8 @@ export class RuntimeMetadataResolver {
selectors: selectors,
first: q.first,
descendants: q.descendants,
propertyName: propertyName
propertyName: propertyName,
read: isPresent(q.read) ? this.getTokenMetadata(q.read) : null
});
}
}

View File

@ -98,8 +98,9 @@ export class ElementAst implements TemplateAst {
constructor(public name: string, public attrs: AttrAst[],
public inputs: BoundElementPropertyAst[], public outputs: BoundEventAst[],
public exportAsVars: VariableAst[], public directives: DirectiveAst[],
public providers: ProviderAst[], public children: TemplateAst[],
public ngContentIndex: number, public sourceSpan: ParseSourceSpan) {}
public providers: ProviderAst[], public hasViewContainer: boolean,
public children: TemplateAst[], public ngContentIndex: number,
public sourceSpan: ParseSourceSpan) {}
visit(visitor: TemplateAstVisitor, context: any): any {
return visitor.visitElement(this, context);
@ -129,8 +130,8 @@ export class ElementAst implements TemplateAst {
export class EmbeddedTemplateAst implements TemplateAst {
constructor(public attrs: AttrAst[], public outputs: BoundEventAst[], public vars: VariableAst[],
public directives: DirectiveAst[], public providers: ProviderAst[],
public children: TemplateAst[], public ngContentIndex: number,
public sourceSpan: ParseSourceSpan) {}
public hasViewContainer: boolean, public children: TemplateAst[],
public ngContentIndex: number, public sourceSpan: ParseSourceSpan) {}
visit(visitor: TemplateAstVisitor, context: any): any {
return visitor.visitEmbeddedTemplate(this, context);

View File

@ -328,7 +328,7 @@ class TemplateParseVisitor implements HtmlAstVisitor {
var isViewRoot = parent.isTemplateElement || hasInlineTemplates;
var providerContext =
new ProviderElementContext(this.providerViewContext, parent.providerContext, isViewRoot,
directiveAsts, attrs, element.sourceSpan);
directiveAsts, attrs, vars, element.sourceSpan);
var children = htmlVisitAll(
preparsedElement.nonBindable ? NON_BINDABLE_VISITOR : this, element.children,
ElementContext.create(isTemplateElement, directiveAsts,
@ -355,9 +355,9 @@ class TemplateParseVisitor implements HtmlAstVisitor {
this._assertNoComponentsNorElementBindingsOnTemplate(directiveAsts, elementProps,
element.sourceSpan);
parsedElement =
new EmbeddedTemplateAst(attrs, events, vars, providerContext.transformedDirectiveAsts,
providerContext.transformProviders, children,
parsedElement = new EmbeddedTemplateAst(
attrs, events, vars, providerContext.transformedDirectiveAsts,
providerContext.transformProviders, providerContext.transformedHasViewContainer, children,
hasInlineTemplates ? null : ngContentIndex, element.sourceSpan);
} else {
this._assertOnlyOneComponent(directiveAsts, element.sourceSpan);
@ -367,7 +367,8 @@ class TemplateParseVisitor implements HtmlAstVisitor {
parsedElement = new ElementAst(
nodeName, attrs, elementProps, events, elementExportAsVars,
providerContext.transformedDirectiveAsts, providerContext.transformProviders, children,
providerContext.transformedDirectiveAsts, providerContext.transformProviders,
providerContext.transformedHasViewContainer, children,
hasInlineTemplates ? null : ngContentIndex, element.sourceSpan);
}
if (hasInlineTemplates) {
@ -382,12 +383,13 @@ class TemplateParseVisitor implements HtmlAstVisitor {
templateDirectiveAsts, templateElementProps, element.sourceSpan);
var templateProviderContext = new ProviderElementContext(
this.providerViewContext, parent.providerContext, parent.isTemplateElement,
templateDirectiveAsts, [], element.sourceSpan);
templateDirectiveAsts, [], templateVars, element.sourceSpan);
templateProviderContext.afterElement();
parsedElement = new EmbeddedTemplateAst([], [], templateVars,
templateProviderContext.transformedDirectiveAsts,
templateProviderContext.transformProviders,
templateProviderContext.transformedHasViewContainer,
[parsedElement], ngContentIndex, element.sourceSpan);
}
return parsedElement;
@ -765,8 +767,8 @@ class NonBindableVisitor implements HtmlAstVisitor {
var selector = createElementCssSelector(ast.name, attrNameAndValues);
var ngContentIndex = parent.findNgContentIndex(selector);
var children = htmlVisitAll(this, ast.children, EMPTY_ELEMENT_CONTEXT);
return new ElementAst(ast.name, htmlVisitAll(this, ast.attrs), [], [], [], [], [], children,
ngContentIndex, ast.sourceSpan);
return new ElementAst(ast.name, htmlVisitAll(this, ast.attrs), [], [], [], [], [], false,
children, ngContentIndex, ast.sourceSpan);
}
visitComment(ast: HtmlCommentAst, context: any): any { return null; }
visitAttr(ast: HtmlAttrAst, context: any): AttrAst {

View File

@ -30,13 +30,13 @@ export class CompileNode {
export class CompileElement extends CompileNode {
static createNull(): CompileElement {
return new CompileElement(null, null, null, null, null, [], [], {});
return new CompileElement(null, null, null, null, null, null, [], [], false, false, {});
}
private _compViewExpr: o.Expression = null;
public component: CompileDirectiveMetadata = null;
private _appElement: o.Expression;
private _defaultInjector: o.Expression;
public appElement: o.ReadPropExpr;
public elementRef: o.Expression;
public injector: o.Expression;
private _instances = new CompileTokenMap<o.Expression>();
private _resolvedProviders: CompileTokenMap<ProviderAst>;
@ -50,17 +50,45 @@ export class CompileElement extends CompileNode {
constructor(parent: CompileElement, view: CompileView, nodeIndex: number,
renderNode: o.Expression, sourceAst: TemplateAst,
public component: CompileDirectiveMetadata,
private _directives: CompileDirectiveMetadata[],
private _resolvedProvidersArray: ProviderAst[],
private _resolvedProvidersArray: ProviderAst[], public hasViewContainer: boolean,
public hasEmbeddedView: boolean,
public variableTokens: {[key: string]: CompileTokenMetadata}) {
super(parent, view, nodeIndex, renderNode, sourceAst);
this.elementRef = o.importExpr(Identifiers.ElementRef).instantiate([this.renderNode]);
this._instances.add(identifierToken(Identifiers.ElementRef), this.elementRef);
this.injector = o.THIS_EXPR.callMethod('injector', [o.literal(this.nodeIndex)]);
this._instances.add(identifierToken(Identifiers.Injector), this.injector);
this._instances.add(identifierToken(Identifiers.Renderer), o.THIS_EXPR.prop('renderer'));
if (this.hasViewContainer || this.hasEmbeddedView || isPresent(this.component)) {
this._createAppElement();
}
}
setComponent(component: CompileDirectiveMetadata, compViewExpr: o.Expression) {
this.component = component;
private _createAppElement() {
var fieldName = `_appEl_${this.nodeIndex}`;
var parentNodeIndex = this.isRootElement() ? null : this.parent.nodeIndex;
this.view.fields.push(new o.ClassField(fieldName, o.importType(Identifiers.AppElement),
[o.StmtModifier.Private]));
var statement = o.THIS_EXPR.prop(fieldName)
.set(o.importExpr(Identifiers.AppElement)
.instantiate([
o.literal(this.nodeIndex),
o.literal(parentNodeIndex),
o.THIS_EXPR,
this.renderNode
]))
.toStmt();
this.view.createMethod.addStmt(statement);
this.appElement = o.THIS_EXPR.prop(fieldName);
this._instances.add(identifierToken(Identifiers.AppElement), this.appElement);
}
setComponentView(compViewExpr: o.Expression) {
this._compViewExpr = compViewExpr;
this.contentNodesByNgContentIndex =
ListWrapper.createFixedSize(component.template.ngContentSelectors.length);
ListWrapper.createFixedSize(this.component.template.ngContentSelectors.length);
for (var i = 0; i < this.contentNodesByNgContentIndex.length; i++) {
this.contentNodesByNgContentIndex[i] = [];
}
@ -71,7 +99,7 @@ export class CompileElement extends CompileNode {
if (isPresent(embeddedView)) {
var createTemplateRefExpr =
o.importExpr(Identifiers.TemplateRef_)
.instantiate([this.getOrCreateAppElement(), this.embeddedView.viewFactory]);
.instantiate([this.appElement, this.embeddedView.viewFactory]);
var provider = new CompileProviderMetadata(
{token: identifierToken(Identifiers.TemplateRef), useValue: createTemplateRefExpr});
// Add TemplateRef as first provider as it does not have deps on other providers
@ -82,6 +110,11 @@ export class CompileElement extends CompileNode {
}
beforeChildren(): void {
if (this.hasViewContainer) {
this._instances.add(identifierToken(Identifiers.ViewContainerRef),
this.appElement.prop('vcRef'));
}
this._resolvedProviders = new CompileTokenMap<ProviderAst>();
this._resolvedProvidersArray.forEach(provider =>
this._resolvedProviders.add(provider.token, provider));
@ -127,35 +160,53 @@ export class CompileElement extends CompileNode {
var directive = this._directives[i];
directive.queries.forEach((queryMeta) => { this._addQuery(queryMeta, directiveInstance); });
}
var queriesWithReads: _QueryWithRead[] = [];
this._resolvedProviders.values().forEach((resolvedProvider) => {
var queriesForProvider = this._getQueriesFor(resolvedProvider.token);
var providerExpr = this._instances.get(resolvedProvider.token);
queriesForProvider.forEach((query) => { query.addValue(providerExpr, this.view); });
ListWrapper.addAll(
queriesWithReads,
queriesForProvider.map(query => new _QueryWithRead(query, resolvedProvider.token)));
});
StringMapWrapper.forEach(this.variableTokens, (_, varName) => {
var token = this.variableTokens[varName];
var varValue;
var varValueForQuery;
if (isPresent(token)) {
varValue = varValueForQuery = this._instances.get(token);
varValue = this._instances.get(token);
} else {
varValueForQuery = this.getOrCreateAppElement().prop('ref');
varValue = this.renderNode;
}
this.view.variables.set(varName, varValue);
this.view.namedAppElements.push([varName, this.getOrCreateAppElement()]);
var queriesForProvider = this._getQueriesFor(new CompileTokenMetadata({value: varName}));
queriesForProvider.forEach((query) => { query.addValue(varValueForQuery, this.view); });
var varToken = new CompileTokenMetadata({value: varName});
ListWrapper.addAll(queriesWithReads, this._getQueriesFor(varToken)
.map(query => new _QueryWithRead(query, varToken)));
});
queriesWithReads.forEach((queryWithRead) => {
var value: o.Expression;
if (isPresent(queryWithRead.read.identifier)) {
// query for an identifier
value = this._instances.get(queryWithRead.read);
} else {
// query for a variable
var token = this.variableTokens[queryWithRead.read.value];
if (isPresent(token)) {
value = this._instances.get(token);
} else {
value = this.elementRef;
}
}
if (isPresent(value)) {
queryWithRead.query.addValue(value, this.view);
}
});
if (isPresent(this.component)) {
var componentConstructorViewQueryList =
isPresent(this.component) ? o.literalArr(this._componentConstructorViewQueryLists) :
o.NULL_EXPR;
var compExpr = isPresent(this.getComponent()) ? this.getComponent() : o.NULL_EXPR;
this.view.createMethod.addStmt(
this.getOrCreateAppElement()
.callMethod('initComponent',
this.appElement.callMethod(
'initComponent',
[compExpr, componentConstructorViewQueryList, this._compViewExpr])
.toStmt());
}
@ -202,43 +253,6 @@ export class CompileElement extends CompileNode {
return res;
}
getOptionalAppElement(): o.Expression { return this._appElement; }
getOrCreateAppElement(): o.Expression {
if (isBlank(this._appElement)) {
var parentNodeIndex = this.isRootElement() ? null : this.parent.nodeIndex;
var fieldName = `_appEl_${this.nodeIndex}`;
this.view.fields.push(new o.ClassField(fieldName, o.importType(Identifiers.AppElement),
[o.StmtModifier.Private]));
var statement = o.THIS_EXPR.prop(fieldName)
.set(o.importExpr(Identifiers.AppElement)
.instantiate([
o.literal(this.nodeIndex),
o.literal(parentNodeIndex),
o.THIS_EXPR,
this.renderNode
]))
.toStmt();
this.view.createMethod.addStmt(statement);
this._appElement = o.THIS_EXPR.prop(fieldName);
}
return this._appElement;
}
getOrCreateInjector(): o.Expression {
if (isBlank(this._defaultInjector)) {
var fieldName = `_inj_${this.nodeIndex}`;
this.view.fields.push(new o.ClassField(fieldName, o.importType(Identifiers.Injector),
[o.StmtModifier.Private]));
var statement = o.THIS_EXPR.prop(fieldName)
.set(o.THIS_EXPR.callMethod('injector', [o.literal(this.nodeIndex)]))
.toStmt();
this.view.createMethod.addStmt(statement);
this._defaultInjector = o.THIS_EXPR.prop(fieldName);
}
return this._defaultInjector;
}
private _getQueriesFor(token: CompileTokenMetadata): CompileQuery[] {
var result: CompileQuery[] = [];
var currentEl: CompileElement = this;
@ -289,30 +303,20 @@ export class CompileElement extends CompileNode {
}
if (isPresent(dep.token)) {
// access builtins
// access builtins with special visibility
if (isBlank(result)) {
if (dep.token.equalsTo(identifierToken(Identifiers.Renderer))) {
result = o.THIS_EXPR.prop('renderer');
} else if (dep.token.equalsTo(identifierToken(Identifiers.ElementRef))) {
result = this.getOrCreateAppElement().prop('ref');
} else if (dep.token.equalsTo(identifierToken(Identifiers.ChangeDetectorRef))) {
if (dep.token.equalsTo(identifierToken(Identifiers.ChangeDetectorRef))) {
if (requestingProviderType === ProviderAstType.Component) {
return this._compViewExpr.prop('ref');
} else {
return o.THIS_EXPR.prop('ref');
}
} else if (dep.token.equalsTo(identifierToken(Identifiers.ViewContainerRef))) {
result = this.getOrCreateAppElement().prop('vcRef');
}
}
// access providers
// access regular providers on the element
if (isBlank(result)) {
result = this._instances.get(dep.token);
}
// access the injector
if (isBlank(result) && dep.token.equalsTo(identifierToken(Identifiers.Injector))) {
result = this.getOrCreateInjector();
}
}
return result;
}
@ -400,3 +404,10 @@ function createProviderProperty(propName: string, provider: ProviderAst,
}
return o.THIS_EXPR.prop(propName);
}
class _QueryWithRead {
public read: CompileTokenMetadata;
constructor(public query: CompileQuery, match: CompileTokenMetadata) {
this.read = isPresent(query.meta.read) ? query.meta.read : match;
}
}

View File

@ -77,7 +77,7 @@ export class CompileQuery {
function createQueryValues(viewValues: ViewQueryValues): o.Expression[] {
return ListWrapper.flatten(viewValues.values.map((entry) => {
if (entry instanceof ViewQueryValues) {
return mapNestedViews(entry.view.declarationElement.getOrCreateAppElement(), entry.view,
return mapNestedViews(entry.view.declarationElement.appElement, entry.view,
createQueryValues(entry));
} else {
return <o.Expression>entry;

View File

@ -33,9 +33,9 @@ export class CompilePipe {
export class CompileView implements NameResolver {
public viewType: ViewType;
public viewQueries: CompileTokenMap<CompileQuery[]>;
public namedAppElements: Array<Array<string | o.Expression>> = [];
public nodes: CompileNode[] = [];
// root nodes or AppElements for ViewContainers
public rootNodesOrAppElements: o.Expression[] = [];
public bindings: CompileBinding[] = [];

View File

@ -59,7 +59,7 @@ export class ChangeDetectionStrategyEnum {
}
export class ViewConstructorVars {
static viewManager = o.variable('viewManager');
static viewUtils = o.variable('viewUtils');
static parentInjector = o.variable('parentInjector');
static declarationEl = o.variable('declarationEl');
}
@ -67,7 +67,7 @@ export class ViewConstructorVars {
export class ViewProperties {
static renderer = o.THIS_EXPR.prop('renderer');
static projectableNodes = o.THIS_EXPR.prop('projectableNodes');
static viewManager = o.THIS_EXPR.prop('viewManager');
static viewUtils = o.THIS_EXPR.prop('viewUtils');
}
export class EventHandlerVars { static event = o.variable('$event'); }

View File

@ -67,9 +67,8 @@ export class CompileEventListener {
}
finishMethod() {
var markPathToRootStart =
this._hasComponentHostListener ?
this.compileElement.getOrCreateAppElement().prop('componentView') :
var markPathToRootStart = this._hasComponentHostListener ?
this.compileElement.appElement.prop('componentView') :
o.THIS_EXPR;
var resultExpr: o.Expression = o.literal(true);
this._actionResultExprs.forEach((expr) => { resultExpr = resultExpr.and(expr); });

View File

@ -189,8 +189,7 @@ export function bindDirectiveInputs(directiveAst: DirectiveAst, directiveInstanc
});
if (isOnPushComp) {
detectChangesInInputsMethod.addStmt(new o.IfStmt(DetectChangesVars.changed, [
compileElement.getOrCreateAppElement()
.prop('componentView')
compileElement.appElement.prop('componentView')
.callMethod('markAsCheckOnce', [])
.toStmt()
]));

View File

@ -92,14 +92,15 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
private _addRootNodeAndProject(node: CompileNode, ngContentIndex: number,
parent: CompileElement) {
var appEl = node instanceof CompileElement ? node.getOptionalAppElement() : null;
var vcAppEl =
(node instanceof CompileElement && node.hasViewContainer) ? node.appElement : null;
if (this._isRootNode(parent)) {
// store root nodes only for embedded/host views
// store appElement as root node only for ViewContainers
if (this.view.viewType !== ViewType.COMPONENT) {
this.view.rootNodesOrAppElements.push(isPresent(appEl) ? appEl : node.renderNode);
this.view.rootNodesOrAppElements.push(isPresent(vcAppEl) ? vcAppEl : node.renderNode);
}
} else if (isPresent(parent.component) && isPresent(ngContentIndex)) {
parent.addContentNode(ngContentIndex, isPresent(appEl) ? appEl : node.renderNode);
parent.addContentNode(ngContentIndex, isPresent(vcAppEl) ? vcAppEl : node.renderNode);
}
}
@ -196,7 +197,7 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
this.view.fields.push(
new o.ClassField(fieldName, o.importType(this.view.genConfig.renderTypes.renderElement),
[o.StmtModifier.Private]));
var createRenderNode = o.THIS_EXPR.prop(fieldName).set(createRenderNodeExpr).toStmt();
this.view.createMethod.addStmt(o.THIS_EXPR.prop(fieldName).set(createRenderNodeExpr).toStmt());
var renderNode = o.THIS_EXPR.prop(fieldName);
@ -204,7 +205,6 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
var directives = ast.directives.map(directiveAst => directiveAst.directive);
var variables =
_readHtmlAndDirectiveVariables(ast.exportAsVars, ast.directives, this.view.viewType);
this.view.createMethod.addStmt(createRenderNode);
var htmlAttrs = _readHtmlAttrs(ast.attrs);
var attrNameAndValues = _mergeHtmlAndDirectiveAttrs(htmlAttrs, directives);
for (var i = 0; i < attrNameAndValues.length; i++) {
@ -216,8 +216,9 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
[renderNode, o.literal(attrName), o.literal(attrValue)])
.toStmt());
}
var compileElement = new CompileElement(parent, this.view, nodeIndex, renderNode, ast,
directives, ast.providers, variables);
var compileElement =
new CompileElement(parent, this.view, nodeIndex, renderNode, ast, component, directives,
ast.providers, ast.hasViewContainer, false, variables);
this.view.nodes.push(compileElement);
var compViewExpr: o.ReadVarExpr = null;
if (isPresent(component)) {
@ -225,14 +226,14 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
new CompileIdentifierMetadata({name: getViewFactoryName(component, 0)});
this.targetDependencies.push(new ViewCompileDependency(component, nestedComponentIdentifier));
compViewExpr = o.variable(`compView_${nodeIndex}`);
compileElement.setComponentView(compViewExpr);
this.view.createMethod.addStmt(compViewExpr.set(o.importExpr(nestedComponentIdentifier)
.callFn([
ViewProperties.viewManager,
compileElement.getOrCreateInjector(),
compileElement.getOrCreateAppElement()
ViewProperties.viewUtils,
compileElement.injector,
compileElement.appElement
]))
.toDeclStmt());
compileElement.setComponent(component, compViewExpr);
}
compileElement.beforeChildren();
this._addRootNodeAndProject(compileElement, ast.ngContentIndex, parent);
@ -259,24 +260,25 @@ class ViewBuilderVisitor implements TemplateAstVisitor {
this.view.fields.push(
new o.ClassField(fieldName, o.importType(this.view.genConfig.renderTypes.renderComment),
[o.StmtModifier.Private]));
var createRenderNode = o.THIS_EXPR.prop(fieldName)
this.view.createMethod.addStmt(
o.THIS_EXPR.prop(fieldName)
.set(ViewProperties.renderer.callMethod(
'createTemplateAnchor',
[
this._getParentRenderNode(parent),
this.view.createMethod.resetDebugInfoExpr(nodeIndex, ast)
]))
.toStmt();
.toStmt());
var renderNode = o.THIS_EXPR.prop(fieldName);
var templateVariableBindings = ast.vars.map(
varAst => [varAst.value.length > 0 ? varAst.value : IMPLICIT_TEMPLATE_VAR, varAst.name]);
var directives = ast.directives.map(directiveAst => directiveAst.directive);
var compileElement = new CompileElement(parent, this.view, nodeIndex, renderNode, ast,
directives, ast.providers, {});
var compileElement =
new CompileElement(parent, this.view, nodeIndex, renderNode, ast, null, directives,
ast.providers, ast.hasViewContainer, true, {});
this.view.nodes.push(compileElement);
this.view.createMethod.addStmt(createRenderNode);
this.nestedViewCount++;
var embeddedView = new CompileView(
@ -413,7 +415,7 @@ function createViewClass(view: CompileView, renderCompTypeVar: o.ReadVarExpr,
var emptyTemplateVariableBindings =
view.templateVariableBindings.map((entry) => [entry[0], o.NULL_EXPR]);
var viewConstructorArgs = [
new o.FnParam(ViewConstructorVars.viewManager.name, o.importType(Identifiers.AppViewManager_)),
new o.FnParam(ViewConstructorVars.viewUtils.name, o.importType(Identifiers.ViewUtils)),
new o.FnParam(ViewConstructorVars.parentInjector.name, o.importType(Identifiers.Injector)),
new o.FnParam(ViewConstructorVars.declarationEl.name, o.importType(Identifiers.AppElement))
];
@ -423,7 +425,7 @@ function createViewClass(view: CompileView, renderCompTypeVar: o.ReadVarExpr,
renderCompTypeVar,
ViewTypeEnum.fromValue(view.viewType),
o.literalMap(emptyTemplateVariableBindings),
ViewConstructorVars.viewManager,
ViewConstructorVars.viewUtils,
ViewConstructorVars.parentInjector,
ViewConstructorVars.declarationEl,
ChangeDetectionStrategyEnum.fromValue(getChangeDetectionMode(view)),
@ -462,7 +464,7 @@ function createViewClass(view: CompileView, renderCompTypeVar: o.ReadVarExpr,
function createViewFactory(view: CompileView, viewClass: o.ClassStmt,
renderCompTypeVar: o.ReadVarExpr): o.Statement {
var viewFactoryArgs = [
new o.FnParam(ViewConstructorVars.viewManager.name, o.importType(Identifiers.AppViewManager_)),
new o.FnParam(ViewConstructorVars.viewUtils.name, o.importType(Identifiers.ViewUtils)),
new o.FnParam(ViewConstructorVars.parentInjector.name, o.importType(Identifiers.Injector)),
new o.FnParam(ViewConstructorVars.declarationEl.name, o.importType(Identifiers.AppElement))
];
@ -478,13 +480,14 @@ function createViewFactory(view: CompileView, viewClass: o.ClassStmt,
initRenderCompTypeStmts = [
new o.IfStmt(renderCompTypeVar.identical(o.NULL_EXPR),
[
renderCompTypeVar.set(ViewConstructorVars.viewManager
.callMethod('createRenderComponentType',
renderCompTypeVar.set(ViewConstructorVars
.viewUtils.callMethod('createRenderComponentType',
[
o.literal(templateUrlInfo),
o.literal(
view.component.template.ngContentSelectors.length),
ViewEncapsulationEnum.fromValue(view.component.template.encapsulation),
o.literal(view.component
.template.ngContentSelectors.length),
ViewEncapsulationEnum
.fromValue(view.component.template.encapsulation),
view.styles
]))
.toStmt()
@ -513,7 +516,7 @@ function generateCreateMethod(view: CompileView): o.Statement[] {
}
var resultExpr: o.Expression;
if (view.viewType === ViewType.HOST) {
resultExpr = (<CompileElement>view.nodes[0]).getOrCreateAppElement();
resultExpr = (<CompileElement>view.nodes[0]).appElement;
} else {
resultExpr = o.NULL_EXPR;
}
@ -523,7 +526,6 @@ function generateCreateMethod(view: CompileView): o.Statement[] {
[
createFlatArray(view.rootNodesOrAppElements),
o.literalArr(view.nodes.map(node => node.renderNode)),
o.literalMap(view.namedAppElements),
o.literalArr(view.disposables),
o.literalArr(view.subscriptions)
])

View File

@ -11,8 +11,7 @@ import {
KeyValueDiffers,
defaultKeyValueDiffers
} from './change_detection/change_detection';
import {AppViewManager} from './linker/view_manager';
import {AppViewManager_} from "./linker/view_manager";
import {ViewUtils} from "./linker/view_utils";
import {ComponentResolver} from './linker/component_resolver';
import {ReflectorComponentResolver} from "./linker/component_resolver";
import {DynamicComponentLoader} from './linker/dynamic_component_loader';
@ -27,7 +26,7 @@ var __unused: Type; // avoid unused import when Type union types are erased
export const APPLICATION_COMMON_PROVIDERS: Array<Type | Provider | any[]> = CONST_EXPR([
new Provider(ComponentResolver, {useClass: ReflectorComponentResolver}),
APP_ID_RANDOM_PROVIDER,
new Provider(AppViewManager, {useClass: AppViewManager_}),
ViewUtils,
new Provider(IterableDiffers, {useValue: defaultIterableDiffers}),
new Provider(KeyValueDiffers, {useValue: defaultKeyValueDiffers}),
new Provider(DynamicComponentLoader, {useClass: DynamicComponentLoader_})

View File

@ -1,6 +1,5 @@
// Public API for compiler
export {ComponentResolver} from './linker/component_resolver';
export {AppViewManager} from './linker/view_manager';
export {QueryList} from './linker/query_list';
export {DynamicComponentLoader} from './linker/dynamic_component_loader';
export {ElementRef} from './linker/element_ref';

View File

@ -1,10 +1,10 @@
import {Injector} from 'angular2/src/core/di';
import {Type, CONST, isPresent, isBlank} from 'angular2/src/facade/lang';
import {unimplemented} from 'angular2/src/facade/exceptions';
import {ElementRef, ElementRef_} from './element_ref';
import {ElementRef} from './element_ref';
import {ViewRef, ViewRef_} from './view_ref';
import {AppElement} from './element';
import {AppViewManager} from './view_manager';
import {ViewUtils} from './view_utils';
import {ChangeDetectorRef} from '../change_detection/change_detection';
/**
@ -38,7 +38,7 @@ export abstract class ComponentRef {
/**
* The {@link ChangeDetectorRef} of the Component instance.
*/
get changeDetectorRef(): ChangeDetectorRef { return unimplemented(); };
get changeDetectorRef(): ChangeDetectorRef { return unimplemented(); }
/**
* The component type.
@ -57,15 +57,15 @@ export abstract class ComponentRef {
}
export class ComponentRef_ extends ComponentRef {
constructor(private _location: AppElement, private _componentType: Type) { super(); }
get location(): ElementRef { return this._location.ref; }
get injector(): Injector { return this._location.injector; }
get instance(): any { return this._location.component; };
get hostView(): ViewRef { return this._location.parentView.ref; };
constructor(private _hostElement: AppElement, private _componentType: Type) { super(); }
get location(): ElementRef { return this._hostElement.elementRef; }
get injector(): Injector { return this._hostElement.injector; }
get instance(): any { return this._hostElement.component; };
get hostView(): ViewRef { return this._hostElement.parentView.ref; };
get changeDetectorRef(): ChangeDetectorRef { return this.hostView; };
get componentType(): Type { return this._componentType; }
destroy(): void { this._location.parentView.destroy(); }
destroy(): void { this._hostElement.parentView.destroy(); }
onDestroy(callback: Function): void { this.hostView.onDestroy(callback); }
}
@ -81,12 +81,12 @@ export class ComponentFactory {
*/
create(injector: Injector, projectableNodes: any[][] = null,
rootSelectorOrNode: string | any = null): ComponentRef {
var vm: AppViewManager = injector.get(AppViewManager);
var vu: ViewUtils = injector.get(ViewUtils);
if (isBlank(projectableNodes)) {
projectableNodes = [];
}
// Note: Host views don't need a declarationAppElement!
var hostView = this._viewFactory(vm, injector, null);
var hostView = this._viewFactory(vu, injector, null);
var hostElement = hostView.create(projectableNodes, rootSelectorOrNode);
return new ComponentRef_(hostElement, this._componentType);
}

View File

@ -1,9 +1,8 @@
import {Key, Injector, ResolvedProvider, Provider, provide, Injectable} from 'angular2/src/core/di';
import {ComponentResolver} from './component_resolver';
import {isType, Type, stringify, isPresent} from 'angular2/src/facade/lang';
import {AppViewManager} from 'angular2/src/core/linker/view_manager';
import {ElementRef, ElementRef_} from './element_ref';
import {ComponentRef} from './component_factory';
import {ViewContainerRef} from './view_container_ref';
/**
* Service for instantiating a Component and attaching it to a View at a specified location.
@ -61,60 +60,9 @@ export abstract class DynamicComponentLoader {
abstract loadAsRoot(type: Type, overrideSelectorOrNode: string | any, injector: Injector,
onDispose?: () => void, projectableNodes?: any[][]): Promise<ComponentRef>;
/**
* Creates an instance of a Component and attaches it to a View Container located inside of the
* Component View of another Component instance.
*
* The targeted Component Instance is specified via its `hostLocation` {@link ElementRef}. The
* location within the Component View of this Component Instance is specified via `anchorName`
* Template Variable Name.
*
* You can optionally provide `providers` to configure the {@link Injector} provisioned for this
* Component Instance.
*
* Returns a promise for the {@link ComponentRef} representing the newly created Component.
*
* ### Example
*
* ```
* @Component({
* selector: 'child-component',
* template: 'Child'
* })
* class ChildComponent {
* }
*
* @Component({
* selector: 'my-app',
* template: 'Parent (<div #child></div>)'
* })
* class MyApp {
* constructor(dcl: DynamicComponentLoader, elementRef: ElementRef) {
* dcl.loadIntoLocation(ChildComponent, elementRef, 'child');
* }
* }
*
* bootstrap(MyApp);
* ```
*
* Resulting DOM:
*
* ```
* <my-app>
* Parent (
* <div #child="" class="ng-binding"></div>
* <child-component class="ng-binding">Child</child-component>
* )
* </my-app>
* ```
*/
abstract loadIntoLocation(type: Type, hostLocation: ElementRef, anchorName: string,
providers?: ResolvedProvider[],
projectableNodes?: any[][]): Promise<ComponentRef>;
/**
* Creates an instance of a Component and attaches it to the View Container found at the
* `location` specified as {@link ElementRef}.
* `location` specified as {@link ViewContainerRef}.
*
* You can optionally provide `providers` to configure the {@link Injector} provisioned for this
* Component Instance.
@ -137,8 +85,8 @@ export abstract class DynamicComponentLoader {
* template: 'Parent'
* })
* class MyApp {
* constructor(dcl: DynamicComponentLoader, elementRef: ElementRef) {
* dcl.loadNextToLocation(ChildComponent, elementRef);
* constructor(dcl: DynamicComponentLoader, viewContainerRef: ViewContainerRef) {
* dcl.loadNextToLocation(ChildComponent, viewContainerRef);
* }
* }
*
@ -152,15 +100,14 @@ export abstract class DynamicComponentLoader {
* <child-component>Child</child-component>
* ```
*/
abstract loadNextToLocation(type: Type, location: ElementRef, providers?: ResolvedProvider[],
abstract loadNextToLocation(type: Type, location: ViewContainerRef,
providers?: ResolvedProvider[],
projectableNodes?: any[][]): Promise<ComponentRef>;
}
@Injectable()
export class DynamicComponentLoader_ extends DynamicComponentLoader {
constructor(private _compiler: ComponentResolver, private _viewManager: AppViewManager) {
super();
}
constructor(private _compiler: ComponentResolver) { super(); }
loadAsRoot(type: Type, overrideSelectorOrNode: string | any, injector: Injector,
onDispose?: () => void, projectableNodes?: any[][]): Promise<ComponentRef> {
@ -175,19 +122,10 @@ export class DynamicComponentLoader_ extends DynamicComponentLoader {
});
}
loadIntoLocation(type: Type, hostLocation: ElementRef, anchorName: string,
providers: ResolvedProvider[] = null,
projectableNodes: any[][] = null): Promise<ComponentRef> {
return this.loadNextToLocation(
type, this._viewManager.getNamedElementInComponentView(hostLocation, anchorName), providers,
projectableNodes);
}
loadNextToLocation(type: Type, location: ElementRef, providers: ResolvedProvider[] = null,
loadNextToLocation(type: Type, location: ViewContainerRef, providers: ResolvedProvider[] = null,
projectableNodes: any[][] = null): Promise<ComponentRef> {
return this._compiler.resolveComponent(type).then(componentFactory => {
var viewContainer = this._viewManager.getViewContainer(location);
return viewContainer.createComponent(componentFactory, viewContainer.length, providers,
return location.createComponent(componentFactory, location.length, providers,
projectableNodes);
});
}

View File

@ -6,37 +6,30 @@ import {Injector} from 'angular2/src/core/di';
import {AppView} from './view';
import {ViewType} from './view_type';
import {ElementRef_} from './element_ref';
import {ElementRef} from './element_ref';
import {ViewContainerRef, ViewContainerRef_} from './view_container_ref';
import {QueryList} from './query_list';
/**
* An AppElement is created for elements that have a ViewContainerRef,
* a nested component or a <template> element to keep data around
* that is needed for later instantiations.
*/
export class AppElement {
public nestedViews: AppView<any>[] = null;
public componentView: AppView<any> = null;
private _ref: ElementRef_;
private _vcRef: ViewContainerRef_;
public component: any;
public componentConstructorViewQueries: QueryList<any>[];
constructor(public index: number, public parentIndex: number, public parentView: AppView<any>,
public nativeElement: any) {}
get ref(): ElementRef_ {
if (isBlank(this._ref)) {
this._ref = new ElementRef_(this);
}
return this._ref;
}
get elementRef(): ElementRef { return new ElementRef(this.nativeElement); }
get vcRef(): ViewContainerRef_ {
if (isBlank(this._vcRef)) {
this._vcRef = new ViewContainerRef_(this);
}
return this._vcRef;
}
get vcRef(): ViewContainerRef_ { return new ViewContainerRef_(this); }
initComponent(component: any, componentConstructorViewQueries: QueryList<any>[],
view: AppView<any>) {

View File

@ -10,7 +10,7 @@ import {AppElement} from './element';
// Note: We don't expose things like `Injector`, `ViewContainer`, ... here,
// i.e. users have to ask for what they need. With that, we can build better analysis tools
// and could do better codegen in the future.
export abstract class ElementRef {
export class ElementRef {
/**
* The underlying native element or `null` if direct access to native elements is not supported
* (e.g. when the application runs in a web worker).
@ -30,13 +30,7 @@ export abstract class ElementRef {
* </p>
* </div>
*/
get nativeElement(): any { return unimplemented(); }
}
export class ElementRef_ implements ElementRef {
constructor(private _element: AppElement) {}
get internalElement(): AppElement { return this._element; }
get nativeElement() { return this._element.nativeElement; }
public nativeElement: any;
constructor(nativeElement: any) { this.nativeElement = nativeElement; }
}

View File

@ -1,4 +1,4 @@
import {ElementRef, ElementRef_} from './element_ref';
import {ElementRef} from './element_ref';
import {AppElement} from './element';
import {AppView} from './view';
import {EmbeddedViewRef} from './view_ref';
@ -37,11 +37,11 @@ export class TemplateRef_ extends TemplateRef {
constructor(private _appElement: AppElement, private _viewFactory: Function) { super(); }
createEmbeddedView(): EmbeddedViewRef {
var view: AppView<any> = this._viewFactory(this._appElement.parentView.viewManager,
var view: AppView<any> = this._viewFactory(this._appElement.parentView.viewUtils,
this._appElement.parentInjector, this._appElement);
view.create(null, null);
return view.ref;
}
get elementRef(): ElementRef { return this._appElement.ref; }
get elementRef(): ElementRef { return this._appElement.elementRef; }
}

View File

@ -27,9 +27,9 @@ import {ObservableWrapper} from 'angular2/src/facade/async';
import {Renderer, RootRenderer, RenderComponentType} from 'angular2/src/core/render/api';
import {ViewRef_} from './view_ref';
import {AppViewManager_, AppViewManager} from './view_manager';
import {ViewType} from './view_type';
import {
ViewUtils,
flattenNestedViewRenderNodes,
ensureSlotCount,
arrayLooseIdentical,
@ -65,7 +65,6 @@ export abstract class AppView<T> {
allNodes: any[];
disposables: Function[];
subscriptions: any[];
namedAppElements: {[key: string]: AppElement};
contentChildren: AppView<any>[] = [];
viewChildren: AppView<any>[] = [];
renderParent: AppView<any>;
@ -95,13 +94,13 @@ export abstract class AppView<T> {
private _hasExternalHostElement: boolean;
constructor(public clazz: any, public componentType: RenderComponentType, public type: ViewType,
public locals: {[key: string]: any}, public viewManager: AppViewManager_,
public locals: {[key: string]: any}, public viewUtils: ViewUtils,
public parentInjector: Injector, public declarationAppElement: AppElement,
public cdMode: ChangeDetectionStrategy, literalArrayCacheSize: number,
literalMapCacheSize: number, public staticNodeDebugInfos: StaticNodeDebugInfo[]) {
this.ref = new ViewRef_(this);
if (type === ViewType.COMPONENT || type === ViewType.HOST) {
this.renderer = viewManager.renderComponent(componentType);
this.renderer = viewUtils.renderComponent(componentType);
} else {
this.renderer = declarationAppElement.parentView.renderer;
}
@ -145,15 +144,15 @@ export abstract class AppView<T> {
}
/**
* Overwritten by implementations
* Overwritten by implementations.
* Returns the AppElement for the host element for ViewType.HOST.
*/
createInternal(rootSelectorOrNode: string | any): AppElement { return null; }
init(rootNodesOrAppElements: any[], allNodes: any[], appElements: {[key: string]: AppElement},
disposables: Function[], subscriptions: any[]) {
init(rootNodesOrAppElements: any[], allNodes: any[], disposables: Function[],
subscriptions: any[]) {
this.rootNodesOrAppElements = rootNodesOrAppElements;
this.allNodes = allNodes;
this.namedAppElements = appElements;
this.disposables = disposables;
this.subscriptions = subscriptions;
if (this.type === ViewType.COMPONENT) {

View File

@ -7,7 +7,7 @@ import {wtfCreateScope, wtfLeave, WtfScopeFn} from '../profile/profile';
import {AppElement} from './element';
import {ElementRef, ElementRef_} from './element_ref';
import {ElementRef} from './element_ref';
import {TemplateRef, TemplateRef_} from './template_ref';
import {EmbeddedViewRef, ViewRef, ViewRef_} from './view_ref';
import {ComponentFactory, ComponentRef} from './component_factory';
@ -27,10 +27,7 @@ import {ComponentFactory, ComponentRef} from './component_factory';
* the Rendered View.
*
* To access a `ViewContainerRef` of an Element, you can either place a {@link Directive} injected
* with `ViewContainerRef` on the Element, or you obtain it via
* {@link AppViewManager#getViewContainer}.
*
* <!-- TODO(i): we are also considering ElementRef#viewContainer api -->
* with `ViewContainerRef` on the Element, or you obtain it via a {@link ViewChild} query.
*/
export abstract class ViewContainerRef {
/**
@ -121,7 +118,7 @@ export class ViewContainerRef_ implements ViewContainerRef {
return isPresent(views) ? views.length : 0;
}
get element(): ElementRef { return this._element.ref; }
get element(): ElementRef { return this._element.elementRef; }
// TODO(rado): profile and decide whether bounds checks should be added
// to the methods below.

View File

@ -1,77 +0,0 @@
import {
Injector,
Inject,
Provider,
Injectable,
ResolvedProvider,
forwardRef
} from 'angular2/src/core/di';
import {isPresent, isBlank, isArray, Type} from 'angular2/src/facade/lang';
import {BaseException} from 'angular2/src/facade/exceptions';
import {ElementRef, ElementRef_} from './element_ref';
import {ViewContainerRef, ViewContainerRef_} from './view_container_ref';
import {RootRenderer, RenderComponentType, Renderer} from 'angular2/src/core/render/api';
import {APP_ID} from 'angular2/src/core/application_tokens';
import {ViewEncapsulation} from 'angular2/src/core/metadata/view';
/**
* Service exposing low level API for creating, moving and destroying Views.
*
* Most applications should use higher-level abstractions like {@link DynamicComponentLoader} and
* {@link ViewContainerRef} instead.
*/
export abstract class AppViewManager {
/**
* Returns a {@link ViewContainerRef} of the View Container at the specified location.
*/
abstract getViewContainer(location: ElementRef): ViewContainerRef;
/**
* Searches the Component View of the Component specified via `hostLocation` and returns the
* {@link ElementRef} for the Element identified via a Variable Name `variableName`.
*
* Throws an exception if the specified `hostLocation` is not a Host Element of a Component, or if
* variable `variableName` couldn't be found in the Component View of this Component.
*/
abstract getNamedElementInComponentView(hostLocation: ElementRef,
variableName: string): ElementRef;
}
@Injectable()
export class AppViewManager_ extends AppViewManager {
private _nextCompTypeId: number = 0;
constructor(private _renderer: RootRenderer, @Inject(APP_ID) private _appId: string) { super(); }
getViewContainer(location: ElementRef): ViewContainerRef {
return (<ElementRef_>location).internalElement.vcRef;
}
getNamedElementInComponentView(hostLocation: ElementRef, variableName: string): ElementRef {
var appEl = (<ElementRef_>hostLocation).internalElement;
var componentView = appEl.componentView;
if (isBlank(componentView)) {
throw new BaseException(`There is no component directive at element ${hostLocation}`);
}
var el = componentView.namedAppElements[variableName];
if (isPresent(el)) {
return el.ref;
}
throw new BaseException(`Could not find variable ${variableName}`);
}
/**
* Used by the generated code
*/
createRenderComponentType(templateUrl: string, slotCount: number,
encapsulation: ViewEncapsulation,
styles: Array<string | any[]>): RenderComponentType {
return new RenderComponentType(`${this._appId}-${this._nextCompTypeId++}`, templateUrl,
slotCount, encapsulation, styles);
}
/** @internal */
renderComponent(renderComponentType: RenderComponentType): Renderer {
return this._renderer.renderComponent(renderComponentType);
}
}

View File

@ -11,6 +11,32 @@ import {BaseException} from 'angular2/src/facade/exceptions';
import {AppElement} from './element';
import {ExpressionChangedAfterItHasBeenCheckedException} from './exceptions';
import {devModeEqual} from 'angular2/src/core/change_detection/change_detection';
import {Inject, Injectable} from 'angular2/src/core/di';
import {RootRenderer, RenderComponentType, Renderer} from 'angular2/src/core/render/api';
import {APP_ID} from 'angular2/src/core/application_tokens';
import {ViewEncapsulation} from 'angular2/src/core/metadata/view';
@Injectable()
export class ViewUtils {
private _nextCompTypeId: number = 0;
constructor(private _renderer: RootRenderer, @Inject(APP_ID) private _appId: string) {}
/**
* Used by the generated code
*/
createRenderComponentType(templateUrl: string, slotCount: number,
encapsulation: ViewEncapsulation,
styles: Array<string | any[]>): RenderComponentType {
return new RenderComponentType(`${this._appId}-${this._nextCompTypeId++}`, templateUrl,
slotCount, encapsulation, styles);
}
/** @internal */
renderComponent(renderComponentType: RenderComponentType): Renderer {
return this._renderer.renderComponent(renderComponentType);
}
}
export function flattenNestedViewRenderNodes(nodes: any[]): any[] {
return _flattenNestedViewRenderNodes(nodes, []);

View File

@ -145,8 +145,9 @@ class Attribute extends AttributeMetadata {
*/
@Deprecated("Use ContentChildren/ContentChild instead")
class Query extends QueryMetadata {
const Query(dynamic /*Type | string*/ selector, {bool descendants: false})
: super(selector, descendants: descendants);
const Query(dynamic /*Type | string*/ selector,
{bool descendants: false, dynamic read: null})
: super(selector, descendants: descendants, read: read);
}
/**
@ -154,15 +155,15 @@ class Query extends QueryMetadata {
*/
class ContentChildren extends ContentChildrenMetadata {
const ContentChildren(dynamic /*Type | string*/ selector,
{bool descendants: false})
: super(selector, descendants: descendants);
{bool descendants: false, dynamic read: null})
: super(selector, descendants: descendants, read: read);
}
/**
* See: [ContentChildMetadata] for docs.
*/
class ContentChild extends ContentChildMetadata {
const ContentChild(dynamic /*Type | string*/ selector) : super(selector);
const ContentChild(dynamic /*Type | string*/ selector, {dynamic read: null}) : super(selector, read: read);
}
/**
@ -170,22 +171,22 @@ class ContentChild extends ContentChildMetadata {
*/
@Deprecated("Use ViewChildren/ViewChild instead")
class ViewQuery extends ViewQueryMetadata {
const ViewQuery(dynamic /*Type | string*/ selector)
: super(selector, descendants: true);
const ViewQuery(dynamic /*Type | string*/ selector, {dynamic read: null})
: super(selector, descendants: true, read: read);
}
/**
* See: [ViewChildrenMetadata] for docs.
*/
class ViewChildren extends ViewChildrenMetadata {
const ViewChildren(dynamic /*Type | string*/ selector) : super(selector);
const ViewChildren(dynamic /*Type | string*/ selector, {dynamic read: null}) : super(selector, read: read);
}
/**
* See: [ViewChildMetadata] for docs.
*/
class ViewChild extends ViewChildMetadata {
const ViewChild(dynamic /*Type | string*/ selector) : super(selector);
const ViewChild(dynamic /*Type | string*/ selector, {dynamic read: null}) : super(selector, read: read);
}
/**

View File

@ -402,40 +402,43 @@ export interface AttributeMetadataFactory {
* ```
*/
export interface QueryMetadataFactory {
(selector: Type | string, {descendants}?: {descendants?: boolean}): ParameterDecorator;
new (selector: Type | string, {descendants}?: {descendants?: boolean}): QueryMetadata;
(selector: Type | string,
{descendants, read}?: {descendants?: boolean, read?: any}): ParameterDecorator;
new (selector: Type | string,
{descendants, read}?: {descendants?: boolean, read?: any}): QueryMetadata;
}
/**
* Factory for {@link ContentChildren}.
*/
export interface ContentChildrenMetadataFactory {
(selector: Type | string, {descendants}?: {descendants?: boolean}): any;
new (selector: Type | string, {descendants}?: {descendants?: boolean}): ContentChildrenMetadata;
(selector: Type | string, {descendants, read}?: {descendants?: boolean, read?: any}): any;
new (selector: Type | string,
{descendants, read}?: {descendants?: boolean, read?: any}): ContentChildrenMetadata;
}
/**
* Factory for {@link ContentChild}.
*/
export interface ContentChildMetadataFactory {
(selector: Type | string): any;
new (selector: Type | string): ContentChildMetadataFactory;
(selector: Type | string, {read}?: {read?: any}): any;
new (selector: Type | string, {read}?: {read?: any}): ContentChildMetadataFactory;
}
/**
* Factory for {@link ViewChildren}.
*/
export interface ViewChildrenMetadataFactory {
(selector: Type | string): any;
new (selector: Type | string): ViewChildrenMetadata;
(selector: Type | string, {read}?: {read?: any}): any;
new (selector: Type | string, {read}?: {read?: any}): ViewChildrenMetadata;
}
/**
* Factory for {@link ViewChild}.
*/
export interface ViewChildMetadataFactory {
(selector: Type | string): any;
new (selector: Type | string): ViewChildMetadataFactory;
(selector: Type | string, {read}?: {read?: any}): any;
new (selector: Type | string, {read}?: {read?: any}): ViewChildMetadataFactory;
}

View File

@ -149,12 +149,18 @@ export class QueryMetadata extends DependencyMetadata {
*/
descendants: boolean;
first: boolean;
/**
* The DI token to read from an element that matches the selector.
*/
read: any;
constructor(private _selector: Type | string,
{descendants = false, first = false}: {descendants?: boolean, first?: boolean} = {}) {
{descendants = false, first = false,
read = null}: {descendants?: boolean, first?: boolean, read?: any} = {}) {
super();
this.descendants = descendants;
this.first = first;
this.read = read;
}
/**
@ -204,8 +210,9 @@ export class QueryMetadata extends DependencyMetadata {
*/
@CONST()
export class ContentChildrenMetadata extends QueryMetadata {
constructor(_selector: Type | string, {descendants = false}: {descendants?: boolean} = {}) {
super(_selector, {descendants: descendants});
constructor(_selector: Type | string,
{descendants = false, read = null}: {descendants?: boolean, read?: any} = {}) {
super(_selector, {descendants: descendants, read: read});
}
}
@ -232,7 +239,9 @@ export class ContentChildrenMetadata extends QueryMetadata {
*/
@CONST()
export class ContentChildMetadata extends QueryMetadata {
constructor(_selector: Type | string) { super(_selector, {descendants: true, first: true}); }
constructor(_selector: Type | string, {read = null}: {read?: any} = {}) {
super(_selector, {descendants: true, first: true, read: read});
}
}
/**
@ -273,8 +282,9 @@ export class ContentChildMetadata extends QueryMetadata {
@CONST()
export class ViewQueryMetadata extends QueryMetadata {
constructor(_selector: Type | string,
{descendants = false, first = false}: {descendants?: boolean, first?: boolean} = {}) {
super(_selector, {descendants: descendants, first: first});
{descendants = false, first = false,
read = null}: {descendants?: boolean, first?: boolean, read?: any} = {}) {
super(_selector, {descendants: descendants, first: first, read: read});
}
/**
@ -363,7 +373,9 @@ export class ViewQueryMetadata extends QueryMetadata {
*/
@CONST()
export class ViewChildrenMetadata extends ViewQueryMetadata {
constructor(_selector: Type | string) { super(_selector, {descendants: true}); }
constructor(_selector: Type | string, {read = null}: {read?: any} = {}) {
super(_selector, {descendants: true, read: read});
}
}
/**
@ -438,5 +450,7 @@ export class ViewChildrenMetadata extends ViewQueryMetadata {
*/
@CONST()
export class ViewChildMetadata extends ViewQueryMetadata {
constructor(_selector: Type | string) { super(_selector, {descendants: true, first: true}); }
constructor(_selector: Type | string, {read = null}: {read?: any} = {}) {
super(_selector, {descendants: true, first: true, read: read});
}
}

View File

@ -186,8 +186,8 @@ export class RouterLinkTransform implements TemplateAstVisitor {
let updatedInputs = ast.inputs.map(c => c.visit(this, context));
let updatedDirectives = ast.directives.map(c => c.visit(this, context));
return new ElementAst(ast.name, ast.attrs, updatedInputs, ast.outputs, ast.exportAsVars,
updatedDirectives, ast.providers, updatedChildren, ast.ngContentIndex,
ast.sourceSpan);
updatedDirectives, ast.providers, ast.hasViewContainer, updatedChildren,
ast.ngContentIndex, ast.sourceSpan);
}
visitVariable(ast: any, context: any): any { return ast; }

View File

@ -7,7 +7,7 @@ import {
Attribute,
DynamicComponentLoader,
ComponentRef,
ElementRef,
ViewContainerRef,
Injector,
provide,
Dependency,
@ -40,7 +40,7 @@ export class RouterOutlet implements OnDestroy {
@Output('activate') public activateEvents = new EventEmitter<any>();
constructor(private _elementRef: ElementRef, private _loader: DynamicComponentLoader,
constructor(private _viewContainerRef: ViewContainerRef, private _loader: DynamicComponentLoader,
private _parentRouter: routerMod.Router, @Attribute('name') nameAttr: string) {
if (isPresent(nameAttr)) {
this.name = nameAttr;
@ -66,7 +66,7 @@ export class RouterOutlet implements OnDestroy {
provide(routerMod.Router, {useValue: childRouter})
]);
this._componentRef =
this._loader.loadNextToLocation(componentType, this._elementRef, providers);
this._loader.loadNextToLocation(componentType, this._viewContainerRef, providers);
return this._componentRef.then((componentRef) => {
this.activateEvents.emit(componentRef.instance);
if (hasLifecycleHook(hookMod.routerOnActivate, componentType)) {

View File

@ -1,4 +1,3 @@
export const NG2_APP_VIEW_MANAGER = 'ng2.AppViewManager';
export const NG2_COMPILER = 'ng2.Compiler';
export const NG2_INJECTOR = 'ng2.Injector';
export const NG2_COMPONENT_FACTORY_REF_MAP = 'ng2.ComponentFactoryRefMap';

View File

@ -1,6 +1,5 @@
import {
provide,
AppViewManager,
ChangeDetectorRef,
Injector,
OnChanges,
@ -30,8 +29,7 @@ export class DowngradeNg2ComponentAdapter {
constructor(private id: string, private info: ComponentInfo,
private element: angular.IAugmentedJQuery, private attrs: angular.IAttributes,
private scope: angular.IScope, private parentInjector: Injector,
private parse: angular.IParseService, private viewManager: AppViewManager,
private componentFactory: ComponentFactory) {
private parse: angular.IParseService, private componentFactory: ComponentFactory) {
(<any>this.element[0]).id = id;
this.componentScope = scope.$new();
this.childNodes = <Node[]><any>element.contents();

View File

@ -2,7 +2,6 @@ import {
provide,
platform,
ApplicationRef,
AppViewManager,
ComponentResolver,
Injector,
NgZone,
@ -26,7 +25,6 @@ import {
NG1_ROOT_SCOPE,
NG1_SCOPE,
NG1_TESTABILITY,
NG2_APP_VIEW_MANAGER,
NG2_COMPILER,
NG2_INJECTOR,
NG2_COMPONENT_FACTORY_REF_MAP,
@ -318,7 +316,6 @@ export class UpgradeAdapter {
.value(NG2_ZONE, ngZone)
.value(NG2_COMPILER, compiler)
.value(NG2_COMPONENT_FACTORY_REF_MAP, componentFactoryRefMap)
.value(NG2_APP_VIEW_MANAGER, injector.get(AppViewManager))
.config([
'$provide',
(provide) => {
@ -542,10 +539,8 @@ interface ComponentFactoryRefMap {
}
function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function {
(<any>directiveFactory).$inject =
[NG2_COMPONENT_FACTORY_REF_MAP, NG2_APP_VIEW_MANAGER, NG1_PARSE];
(<any>directiveFactory).$inject = [NG2_COMPONENT_FACTORY_REF_MAP, NG1_PARSE];
function directiveFactory(componentFactoryRefMap: ComponentFactoryRefMap,
viewManager: AppViewManager,
parse: angular.IParseService): angular.IDirective {
var componentFactory: ComponentFactory = componentFactoryRefMap[info.selector];
if (!componentFactory) throw new Error('Expecting ComponentFactory for: ' + info.selector);
@ -557,9 +552,9 @@ function ng1ComponentDirective(info: ComponentInfo, idPrefix: string): Function
post: (scope: angular.IScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes,
parentInjector: any, transclude: angular.ITranscludeFunction): void => {
var domElement = <any>element[0];
var facade = new DowngradeNg2ComponentAdapter(idPrefix + (idCount++), info, element,
attrs, scope, <Injector>parentInjector,
parse, viewManager, componentFactory);
var facade =
new DowngradeNg2ComponentAdapter(idPrefix + (idCount++), info, element, attrs, scope,
<Injector>parentInjector, parse, componentFactory);
facade.setupInputs();
facade.bootstrapNg2();
facade.projectContent();

View File

@ -1506,7 +1506,8 @@ class FooAstTransformer implements TemplateAstVisitor {
visitEmbeddedTemplate(ast: EmbeddedTemplateAst, context: any): any { throw 'not implemented'; }
visitElement(ast: ElementAst, context: any): any {
if (ast.name != 'div') return ast;
return new ElementAst('foo', [], [], [], [], [], [], [], ast.ngContentIndex, ast.sourceSpan);
return new ElementAst('foo', [], [], [], [], [], [], false, [], ast.ngContentIndex,
ast.sourceSpan);
}
visitVariable(ast: VariableAst, context: any): any { throw 'not implemented'; }
visitEvent(ast: BoundEventAst, context: any): any { throw 'not implemented'; }
@ -1523,6 +1524,7 @@ class FooAstTransformer implements TemplateAstVisitor {
class BarAstTransformer extends FooAstTransformer {
visitElement(ast: ElementAst, context: any): any {
if (ast.name != 'foo') return ast;
return new ElementAst('bar', [], [], [], [], [], [], [], ast.ngContentIndex, ast.sourceSpan);
return new ElementAst('bar', [], [], [], [], [], [], false, [], ast.ngContentIndex,
ast.sourceSpan);
}
}

View File

@ -17,11 +17,11 @@ import {
} from 'angular2/testing_internal';
import {Predicate} from 'angular2/src/facade/collection';
import {Injector, OnDestroy, DebugElement, Type} from 'angular2/core';
import {Injector, OnDestroy, DebugElement, Type, ViewContainerRef, ViewChild} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {Component, ViewMetadata} from 'angular2/src/core/metadata';
import {DynamicComponentLoader} from 'angular2/src/core/linker/dynamic_component_loader';
import {ElementRef, ElementRef_} from 'angular2/src/core/linker/element_ref';
import {ElementRef} from 'angular2/src/core/linker/element_ref';
import {DOCUMENT} from 'angular2/src/platform/dom/dom_tokens';
import {DOM} from 'angular2/src/platform/dom/dom_adapter';
import {BaseException} from 'angular2/src/facade/exceptions';
@ -29,112 +29,77 @@ import {PromiseWrapper} from 'angular2/src/facade/promise';
export function main() {
describe('DynamicComponentLoader', function() {
describe("loading into a location", () => {
describe("loading next to a location", () => {
it('should work',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp,
new ViewMetadata(
{template: '<location #loc></location>', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
loader.loadIntoLocation(DynamicallyLoaded, tc.elementRef, 'loc')
tcb.createAsync(MyComp).then((tc) => {
tc.detectChanges();
loader.loadNextToLocation(DynamicallyLoaded,
tc.componentInstance.viewContainerRef)
.then(ref => {
expect(tc.debugElement.nativeElement)
.toHaveText("Location;DynamicallyLoaded;");
expect(tc.debugElement.nativeElement).toHaveText('DynamicallyLoaded;');
async.done();
});
});
}));
it('should return a disposable component ref',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
inject(
[DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp,
new ViewMetadata(
{template: '<location #loc></location>', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
loader.loadIntoLocation(DynamicallyLoaded, tc.elementRef, 'loc')
.then(ref => {
ref.destroy();
expect(tc.debugElement.nativeElement).toHaveText("Location;");
async.done();
});
});
}));
it('should allow to destroy even if the location has been removed',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<child-cmp *ngIf="ctxBoolProp"></child-cmp>',
directives: [NgIf, ChildComp]
}))
.overrideView(
ChildComp,
new ViewMetadata(
{template: '<location #loc></location>', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
tc.debugElement.componentInstance.ctxBoolProp = true;
tcb.createAsync(MyComp).then((tc) => {
tc.detectChanges();
var childElementRef = tc.debugElement.query(filterByDirective(ChildComp))
.inject(ChildComp)
.elementRef;
loader.loadIntoLocation(DynamicallyLoaded, childElementRef, 'loc')
loader.loadNextToLocation(DynamicallyLoaded, tc.componentInstance.viewContainerRef)
.then(ref => {
loader.loadNextToLocation(DynamicallyLoaded2,
tc.componentInstance.viewContainerRef)
.then(ref2 => {
expect(tc.debugElement.nativeElement)
.toHaveText("Location;DynamicallyLoaded;");
.toHaveText("DynamicallyLoaded;DynamicallyLoaded2;");
tc.debugElement.componentInstance.ctxBoolProp = false;
tc.detectChanges();
expect(tc.debugElement.nativeElement).toHaveText("");
ref2.destroy();
expect(tc.debugElement.nativeElement).toHaveText("DynamicallyLoaded;");
ref.destroy();
expect(tc.debugElement.nativeElement).toHaveText("");
async.done();
});
});
});
}));
it('should update host properties',
inject(
[DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp, new ViewMetadata(
{template: '<location #loc></location>', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
loader.loadIntoLocation(DynamicallyLoadedWithHostProps, tc.elementRef, 'loc')
tcb.createAsync(MyComp).then((tc) => {
tc.detectChanges();
loader.loadNextToLocation(DynamicallyLoadedWithHostProps,
tc.componentInstance.viewContainerRef)
.then(ref => {
ref.instance.id = "new value";
tc.detectChanges();
var newlyInsertedElement =
DOM.childNodes(tc.debugElement.nativeElement)[1];
var newlyInsertedElement = tc.debugElement.childNodes[1].nativeNode;
expect((<HTMLElement>newlyInsertedElement).id).toEqual("new value");
async.done();
});
});
}));
it('should leave the view tree in a consistent state if hydration fails',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<div><location #loc></location></div>',
directives: [Location]
}))
.createAsync(MyComp)
.then((tc: ComponentFixture) => {
tcb.createAsync(MyComp).then((tc: ComponentFixture) => {
tc.detectChanges();
PromiseWrapper.catchError(
loader.loadIntoLocation(DynamicallyLoadedThrows, tc.elementRef, 'loc'),
loader.loadNextToLocation(DynamicallyLoadedThrows,
tc.componentInstance.viewContainerRef),
(error) => {
expect(error.message).toContain("ThrownInConstructor");
expect(() => tc.detectChanges()).not.toThrow();
@ -144,34 +109,18 @@ export function main() {
});
}));
it('should throw if the variable does not exist',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(
MyComp,
new ViewMetadata(
{template: '<location #loc></location>', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
expect(() => loader.loadIntoLocation(DynamicallyLoadedWithHostProps,
tc.elementRef, 'someUnknownVariable'))
.toThrowError('Could not find variable someUnknownVariable');
async.done();
});
}));
it('should allow to pass projectable nodes',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp,
new ViewMetadata({template: '<div #loc></div>', directives: []}))
.createAsync(MyComp)
.then((tc) => {
loader.loadIntoLocation(DynamicallyLoadedWithNgContent, tc.elementRef,
'loc', null, [[DOM.createTextNode('hello')]])
tcb.createAsync(MyComp).then((tc) => {
tc.detectChanges();
loader.loadNextToLocation(DynamicallyLoadedWithNgContent,
tc.componentInstance.viewContainerRef, null,
[[DOM.createTextNode('hello')]])
.then(ref => {
tc.detectChanges();
expect(tc.nativeElement).toHaveText('dynamic(hello)');
var newlyInsertedElement = tc.debugElement.childNodes[1].nativeNode;
expect(newlyInsertedElement).toHaveText('dynamic(hello)');
async.done();
});
});
@ -180,119 +129,16 @@ export function main() {
it('should not throw if not enough projectable nodes are passed in',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp,
new ViewMetadata({template: '<div #loc></div>', directives: []}))
.createAsync(MyComp)
.then((tc) => {
loader.loadIntoLocation(DynamicallyLoadedWithNgContent, tc.elementRef,
'loc', null, [])
tcb.createAsync(MyComp).then((tc) => {
tc.detectChanges();
loader.loadNextToLocation(DynamicallyLoadedWithNgContent,
tc.componentInstance.viewContainerRef, null, [])
.then((_) => { async.done(); });
});
}));
});
describe("loading next to a location", () => {
it('should work',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<div><location #loc></location></div>',
directives: [Location]
}))
.createAsync(MyComp)
.then((tc) => {
loader.loadNextToLocation(DynamicallyLoaded, tc.elementRef)
.then(ref => {
expect(tc.debugElement.nativeElement).toHaveText("Location;");
expect(DOM.nextSibling(tc.debugElement.nativeElement))
.toHaveText('DynamicallyLoaded;');
async.done();
});
});
}));
it('should return a disposable component ref',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<div><location #loc></location></div>',
directives: [Location]
}))
.
createAsync(MyComp)
.then((tc) => {
loader.loadNextToLocation(DynamicallyLoaded, tc.elementRef)
.then(ref => {
loader.loadNextToLocation(DynamicallyLoaded2, tc.elementRef)
.then(ref2 => {
var firstSibling =
DOM.nextSibling(tc.debugElement.nativeElement);
var secondSibling = DOM.nextSibling(firstSibling);
expect(tc.debugElement.nativeElement).toHaveText("Location;");
expect(firstSibling).toHaveText("DynamicallyLoaded;");
expect(secondSibling).toHaveText("DynamicallyLoaded2;");
ref2.destroy();
firstSibling = DOM.nextSibling(tc.debugElement.nativeElement);
secondSibling = DOM.nextSibling(firstSibling);
expect(secondSibling).toBeNull();
async.done();
});
});
});
}));
it('should update host properties',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({
template: '<div><location #loc></location></div>',
directives: [Location]
}))
.createAsync(MyComp)
.then((tc) => {
loader.loadNextToLocation(DynamicallyLoadedWithHostProps, tc.elementRef)
.then(ref => {
ref.instance.id = "new value";
tc.detectChanges();
var newlyInsertedElement =
DOM.nextSibling(tc.debugElement.nativeElement);
expect((<HTMLElement>newlyInsertedElement).id).toEqual("new value");
async.done();
});
});
}));
it('should allow to pass projectable nodes',
inject([DynamicComponentLoader, TestComponentBuilder, AsyncTestCompleter],
(loader: DynamicComponentLoader, tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({template: '', directives: [Location]}))
.createAsync(MyComp)
.then((tc) => {
loader.loadNextToLocation(DynamicallyLoadedWithNgContent, tc.elementRef,
null, [[DOM.createTextNode('hello')]])
.then(ref => {
tc.detectChanges();
var newlyInsertedElement =
DOM.nextSibling(tc.debugElement.nativeElement);
expect(newlyInsertedElement).toHaveText('dynamic(hello)');
async.done();
});
});
}));
});
describe('loadAsRoot', () => {
it('should allow to create, update and destroy components',
inject([AsyncTestCompleter, DynamicComponentLoader, DOCUMENT, Injector],
@ -362,27 +208,6 @@ class ChildComp {
constructor(public elementRef: ElementRef) { this.ctxProp = 'hello'; }
}
class DynamicallyCreatedComponentService {}
@Component({
selector: 'hello-cmp',
viewProviders: [DynamicallyCreatedComponentService],
template: "{{greeting}}"
})
class DynamicallyCreatedCmp implements OnDestroy {
greeting: string;
dynamicallyCreatedComponentService: DynamicallyCreatedComponentService;
destroyed: boolean = false;
constructor(a: DynamicallyCreatedComponentService) {
this.greeting = "hello";
this.dynamicallyCreatedComponentService = a;
}
ngOnDestroy() { this.destroyed = true; }
}
@Component({selector: 'dummy', template: "DynamicallyLoaded;"})
class DynamicallyLoaded {
}
@ -410,16 +235,11 @@ class DynamicallyLoadedWithNgContent {
constructor() { this.id = "default"; }
}
@Component({selector: 'location', template: "Location;"})
class Location {
elementRef: ElementRef;
constructor(elementRef: ElementRef) { this.elementRef = elementRef; }
}
@Component({selector: 'my-comp', directives: []})
@Component({selector: 'my-comp', directives: [], template: '<div #loc></div>'})
class MyComp {
ctxBoolProp: boolean;
@ViewChild('loc', {read: ViewContainerRef}) viewContainerRef: ViewContainerRef;
constructor() { this.ctxBoolProp = false; }
}

View File

@ -286,6 +286,99 @@ export function main() {
});
describe('read a different token', () => {
it('should contain all content children',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-content-children-read #q text="ca"><div #q text="cb"></div></needs-content-children-read>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var comp: NeedsContentChildrenWithRead =
view.debugElement.children[0].inject(NeedsContentChildrenWithRead);
expect(comp.textDirChildren.map(textDirective => textDirective.text))
.toEqual(['ca', 'cb']);
async.done();
});
}));
it('should contain the first content child',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-content-child-read><div #q text="ca"></div></needs-content-child-read>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var comp: NeedsContentChildWithRead =
view.debugElement.children[0].inject(NeedsContentChildWithRead);
expect(comp.textDirChild.text).toEqual('ca');
async.done();
});
}));
it('should contain the first view child',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-view-child-read></needs-view-child-read>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var comp: NeedsViewChildWithRead =
view.debugElement.children[0].inject(NeedsViewChildWithRead);
expect(comp.textDirChild.text).toEqual('va');
async.done();
});
}));
it('should contain all child directives in the view',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template = '<needs-view-children-read></needs-view-children-read>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var comp: NeedsViewChildrenWithRead =
view.debugElement.children[0].inject(NeedsViewChildrenWithRead);
expect(comp.textDirChildren.map(textDirective => textDirective.text))
.toEqual(['va', 'vb']);
async.done();
});
}));
it('should support reading a ViewContainer',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
var template =
'<needs-viewcontainer-read><template>hello</template></needs-viewcontainer-read>';
tcb.overrideTemplate(MyComp, template)
.createAsync(MyComp)
.then((view) => {
view.detectChanges();
var comp: NeedsViewContainerWithRead =
view.debugElement.children[0].inject(NeedsViewContainerWithRead);
comp.createView();
expect(view.debugElement.children[0].nativeElement).toHaveText('hello');
async.done();
});
}));
});
describe("changes", () => {
it('should notify query on change',
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder, async) => {
@ -923,6 +1016,47 @@ class NeedsTpl {
}
}
@Component({selector: 'needs-content-children-read', template: ''})
class NeedsContentChildrenWithRead {
@ContentChildren('q', {read: TextDirective}) textDirChildren: QueryList<TextDirective>;
@ContentChildren('nonExisting', {read: TextDirective}) nonExistingVar: QueryList<TextDirective>;
}
@Component({selector: 'needs-content-child-read', template: ''})
class NeedsContentChildWithRead {
@ContentChild('q', {read: TextDirective}) textDirChild: TextDirective;
@ContentChild('nonExisting', {read: TextDirective}) nonExistingVar: TextDirective;
}
@Component({
selector: 'needs-view-children-read',
template: '<div #q text="va"></div><div #q text="vb"></div>',
directives: [TextDirective]
})
class NeedsViewChildrenWithRead {
@ViewChildren('q', {read: TextDirective}) textDirChildren: QueryList<TextDirective>;
@ViewChildren('nonExisting', {read: TextDirective}) nonExistingVar: QueryList<TextDirective>;
}
@Component({
selector: 'needs-view-child-read',
template: '<div #q text="va"></div>',
directives: [TextDirective]
})
class NeedsViewChildWithRead {
@ViewChild('q', {read: TextDirective}) textDirChild: TextDirective;
@ViewChild('nonExisting', {read: TextDirective}) nonExistingVar: TextDirective;
}
@Component({selector: 'needs-viewcontainer-read', template: '<div #q></div>'})
class NeedsViewContainerWithRead {
@ViewChild('q', {read: ViewContainerRef}) vc: ViewContainerRef;
@ViewChild('nonExisting', {read: ViewContainerRef}) nonExistingVar: ViewContainerRef;
@ContentChild(TemplateRef) template: TemplateRef;
createView() { this.vc.createEmbeddedView(this.template); }
}
@Component({
selector: 'my-comp',
directives: [
@ -946,7 +1080,12 @@ class NeedsTpl {
InertDirective,
NgIf,
NgFor,
NeedsFourQueries
NeedsFourQueries,
NeedsContentChildrenWithRead,
NeedsContentChildWithRead,
NeedsViewChildrenWithRead,
NeedsViewChildWithRead,
NeedsViewContainerWithRead
],
template: ''
})

View File

@ -604,7 +604,7 @@ export function main() {
it("should inject TemplateRef", fakeAsync(() => {
var el = createComp('<template needsViewContainerRef needsTemplateRef></template>', tcb);
expect(el.childNodes[0].inject(NeedsTemplateRef).templateRef.elementRef)
.toBe(el.childNodes[0].inject(NeedsViewContainerRef).viewContainer.element);
.toEqual(el.childNodes[0].inject(NeedsViewContainerRef).viewContainer.element);
}));
it("should throw if there is no TemplateRef", fakeAsync(() => {

View File

@ -145,7 +145,6 @@ var NG_CORE = [
'APP_ID',
'AngularEntrypoint:dart',
'AbstractProviderError',
'AppViewManager',
'ApplicationRef',
'APPLICATION_COMMON_PROVIDERS',
'Attribute',

View File

@ -1,4 +1,4 @@
import {Component, ComponentRef} from 'angular2/core';
import {Component, ComponentRef, ViewContainerRef, ViewChild} from 'angular2/core';
import {
AsyncRoute,
Route,
@ -11,7 +11,6 @@ import {
import {PromiseWrapper} from 'angular2/src/facade/async';
import {isPresent} from 'angular2/src/facade/lang';
import {DynamicComponentLoader} from 'angular2/src/core/linker/dynamic_component_loader';
import {ElementRef} from 'angular2/src/core/linker/element_ref';
@Component({selector: 'goodbye-cmp', template: `{{farewell}}`})
export class GoodbyeCmp {
@ -144,16 +143,17 @@ export class RedirectToParentCmp {
@RouteConfig([new Route({path: '/', component: HelloCmp})])
export class DynamicLoaderCmp {
private _componentRef: ComponentRef = null;
constructor(private _dynamicComponentLoader: DynamicComponentLoader,
private _elementRef: ElementRef) {}
@ViewChild('viewport', {read: ViewContainerRef}) private _viewport: ViewContainerRef;
constructor(private _dynamicComponentLoader: DynamicComponentLoader) {}
onSomeAction(): Promise<any> {
if (isPresent(this._componentRef)) {
this._componentRef.destroy();
this._componentRef = null;
}
return this._dynamicComponentLoader.loadIntoLocation(DynamicallyLoadedComponent,
this._elementRef, 'viewport')
return this._dynamicComponentLoader.loadNextToLocation(DynamicallyLoadedComponent,
this._viewport)
.then((cmp) => { this._componentRef = cmp; });
}
}

View File

@ -21,7 +21,8 @@ import {
ViewMetadata,
Component,
Injectable,
ElementRef
ElementRef,
ComponentRef
} from 'angular2/core';
import {NgIf} from 'angular2/common';
import {WebWorkerRootRenderer} from "angular2/src/web_workers/worker/renderer";
@ -119,8 +120,8 @@ export function main() {
return uiRenderStore.deserialize(id);
}
function getRenderer(elementRef: ElementRef) {
return (<any>elementRef).internalElement.parentView.renderer;
function getRenderer(componentRef: ComponentRef) {
return (<any>componentRef.hostView).internalView.renderer;
}
it('should update text nodes',
@ -145,8 +146,8 @@ export function main() {
{template: '<input [title]="y" style="position:absolute">'}))
.createAsync(MyComp)
.then((fixture) => {
var checkSetters = (componentElRef, workerEl) => {
var renderer = getRenderer(componentElRef);
var checkSetters = (componentRef, workerEl) => {
var renderer = getRenderer(componentRef);
var el = getRenderElement(workerEl);
renderer.setElementProperty(workerEl, 'tabIndex', 1);
expect((<HTMLInputElement>el).tabIndex).toEqual(1);
@ -166,9 +167,9 @@ export function main() {
};
// root element
checkSetters(fixture.elementRef, fixture.debugElement.nativeElement);
checkSetters(fixture.componentRef, fixture.debugElement.nativeElement);
// nested elements
checkSetters(fixture.elementRef, fixture.debugElement.children[0].nativeElement);
checkSetters(fixture.componentRef, fixture.debugElement.children[0].nativeElement);
async.done();
});
@ -220,7 +221,7 @@ export function main() {
.createAsync(MyComp)
.then((fixture) => {
var el = fixture.debugElement.children[0];
getRenderer(fixture.elementRef)
getRenderer(fixture.componentRef)
.invokeElementMethod(el.nativeElement, 'setAttribute', ['a', 'b']);
expect(DOM.getAttribute(getRenderElement(el.nativeElement), 'a')).toEqual('b');

View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/platform/browser';
import {Component, Directive, DynamicComponentLoader, ElementRef} from 'angular2/core';
import {Component, Directive, DynamicComponentLoader, ViewContainerRef} from 'angular2/core';
import {NgIf, NgFor} from 'angular2/common';
import {ApplicationRef} from 'angular2/src/core/application_ref';
import {ListWrapper} from 'angular2/src/facade/collection';
@ -53,7 +53,7 @@ class DummyDirective {
@Directive({selector: 'dynamic-dummy'})
class DynamicDummy {
constructor(loader: DynamicComponentLoader, location: ElementRef) {
constructor(loader: DynamicComponentLoader, location: ViewContainerRef) {
loader.loadNextToLocation(DummyComponent, location);
}
}

View File

@ -28,9 +28,6 @@ const CORE = [
'AfterViewChecked.ngAfterViewChecked():any',
'AfterViewInit',
'AfterViewInit.ngAfterViewInit():any',
'AppViewManager',
'AppViewManager.getNamedElementInComponentView(hostLocation:ElementRef, variableName:string):ElementRef',
'AppViewManager.getViewContainer(location:ElementRef):ViewContainerRef',
'ApplicationRef',
'ApplicationRef.bootstrap(componentType:Type, providers:Array<Type|Provider|any[]>):Promise<ComponentRef>',
'ApplicationRef.componentTypes:Type[]',
@ -104,10 +101,10 @@ const CORE = [
'ConcreteType',
'ContentChildMetadataFactory',
'ContentChildMetadata',
'ContentChildMetadata.constructor(_selector:Type|string)',
'ContentChildMetadata.constructor(_selector:Type|string, {read=null}:{read?:any})',
'ContentChildrenMetadataFactory',
'ContentChildrenMetadata',
'ContentChildrenMetadata.constructor(_selector:Type|string, {descendants=false}:{descendants?:boolean})',
'ContentChildrenMetadata.constructor(_selector:Type|string, {descendants=false,read=null}:{descendants?:boolean, read?:any})',
'CyclicDependencyError',
'CyclicDependencyError.constructor(injector:Injector, key:Key)',
'DebugNode',
@ -161,10 +158,10 @@ const CORE = [
'DoCheck.ngDoCheck():any',
'DynamicComponentLoader',
'DynamicComponentLoader.loadAsRoot(type:Type, overrideSelectorOrNode:string, injector:Injector, onDispose:() => void, projectableNodes:any[][]):Promise<ComponentRef>',
'DynamicComponentLoader.loadIntoLocation(type:Type, hostLocation:ElementRef, anchorName:string, providers:ResolvedProvider[], projectableNodes:any[][]):Promise<ComponentRef>',
'DynamicComponentLoader.loadNextToLocation(type:Type, location:ElementRef, providers:ResolvedProvider[], projectableNodes:any[][]):Promise<ComponentRef>',
'DynamicComponentLoader.loadNextToLocation(type:Type, location:ViewContainerRef, providers:ResolvedProvider[], projectableNodes:any[][]):Promise<ComponentRef>',
'ElementRef',
'ElementRef.nativeElement:any',
'ElementRef.constructor(nativeElement:any)',
'EmbeddedViewRef',
'EmbeddedViewRef.hasLocal(variableName:string):boolean',
'EmbeddedViewRef.rootNodes:any[]',
@ -344,7 +341,8 @@ const CORE = [
'QueryList.toString():string',
'QueryList<T>',
'QueryMetadata',
'QueryMetadata.constructor(_selector:Type|string, {descendants=false,first=false}:{descendants?:boolean, first?:boolean})',
'QueryMetadata.constructor(_selector:Type|string, {descendants=false,first=false,read=null}:{descendants?:boolean, first?:boolean, read?:any})',
'QueryMetadata.read:any',
'QueryMetadata.descendants:boolean',
'QueryMetadata.first:boolean',
'QueryMetadata.isVarBindingQuery:boolean',
@ -438,10 +436,10 @@ const CORE = [
'TypeDecorator.annotations:any[]',
'ViewChildMetadataFactory',
'ViewChildMetadata',
'ViewChildMetadata.constructor(_selector:Type|string)',
'ViewChildMetadata.constructor(_selector:Type|string, {read=null}:{read?:any})',
'ViewChildrenMetadataFactory',
'ViewChildrenMetadata',
'ViewChildrenMetadata.constructor(_selector:Type|string)',
'ViewChildrenMetadata.constructor(_selector:Type|string, {read=null}:{read?:any})',
'ViewContainerRef',
'ViewContainerRef.clear():void',
'ViewContainerRef.createEmbeddedView(templateRef:TemplateRef, index:number):EmbeddedViewRef',
@ -470,7 +468,7 @@ const CORE = [
'ViewMetadata.template:string',
'ViewMetadata.templateUrl:string',
'ViewQueryMetadata',
'ViewQueryMetadata.constructor(_selector:Type|string, {descendants=false,first=false}:{descendants?:boolean, first?:boolean})',
'ViewQueryMetadata.constructor(_selector:Type|string, {descendants=false,first=false,read=null}:{descendants?:boolean, first?:boolean, read?:any})',
'ViewQueryMetadata.isViewQuery:any',
'ViewQueryMetadata.toString():string',
'ViewRef',
@ -844,12 +842,12 @@ const COMPILER =
'DirectiveAst.constructor(directive:CompileDirectiveMetadata, inputs:BoundDirectivePropertyAst[], hostProperties:BoundElementPropertyAst[], hostEvents:BoundEventAst[], exportAsVars:VariableAst[], sourceSpan:ParseSourceSpan)',
'DirectiveAst.visit(visitor:TemplateAstVisitor, context:any):any',
'ElementAst',
'ElementAst.constructor(name:string, attrs:AttrAst[], inputs:BoundElementPropertyAst[], outputs:BoundEventAst[], exportAsVars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'ElementAst.constructor(name:string, attrs:AttrAst[], inputs:BoundElementPropertyAst[], outputs:BoundEventAst[], exportAsVars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'ElementAst.getComponent():CompileDirectiveMetadata',
'ElementAst.isBound():boolean',
'ElementAst.visit(visitor:TemplateAstVisitor, context:any):any',
'EmbeddedTemplateAst',
'EmbeddedTemplateAst.constructor(attrs:AttrAst[], outputs:BoundEventAst[], vars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'EmbeddedTemplateAst.constructor(attrs:AttrAst[], outputs:BoundEventAst[], vars:VariableAst[], directives:DirectiveAst[], providers:ProviderAst[], hasViewContainer:boolean, children:TemplateAst[], ngContentIndex:number, sourceSpan:ParseSourceSpan)',
'EmbeddedTemplateAst.visit(visitor:TemplateAstVisitor, context:any):any',
'NgContentAst',
'NgContentAst.constructor(index:number, ngContentIndex:number, sourceSpan:ParseSourceSpan)',
@ -958,7 +956,8 @@ const COMPILER =
'CompileProviderMetadata.useFactory:CompileFactoryMetadata',
'CompileProviderMetadata.useValue:any',
'CompileQueryMetadata',
'CompileQueryMetadata.constructor({selectors,descendants,first,propertyName}:{selectors?:Array<CompileTokenMetadata>, descendants?:boolean, first?:boolean, propertyName?:string})',
'CompileQueryMetadata.constructor({selectors,descendants,first,propertyName,read}:{selectors?:Array<CompileTokenMetadata>, descendants?:boolean, first?:boolean, propertyName?:string, read?:CompileTokenMetadata})',
'CompileQueryMetadata.read:CompileTokenMetadata',
'CompileQueryMetadata.descendants:boolean',
'CompileQueryMetadata.first:boolean',
'CompileQueryMetadata.fromJson(data:{[key:string]:any}):CompileQueryMetadata',