(
}
}
-/**
- * Enables directive matching on elements.
- *
- * * Example:
- * ```
- *
- * Should match component / directive.
- *
- *
- *
- *
- * Should not match component / directive because we are in ngNonBindable.
- *
- *
- *
- * ```
- */
-export function enableBindings(): void {
- bindingsEnabled = true;
-}
-
-/**
- * Disables directive matching on element.
- *
- * * Example:
- * ```
- *
- * Should match component / directive.
- *
- *
- *
- *
- * Should not match component / directive because we are in ngNonBindable.
- *
- *
- *
- * ```
- */
-export function disableBindings(): void {
- bindingsEnabled = false;
-}
-
/**
* Constructs a TNode object from the arguments.
*
@@ -1409,11 +986,12 @@ export function disableBindings(): void {
* @returns the TNode object
*/
export function createTNode(
- type: TNodeType, adjustedIndex: number, tagName: string | null, attrs: TAttributes | null,
- tViews: TView[] | null): TNode {
+ viewData: LViewData, type: TNodeType, adjustedIndex: number, tagName: string | null,
+ attrs: TAttributes | null, tViews: TView[] | null): TNode {
+ const previousOrParentTNode = getPreviousOrParentTNode();
ngDevMode && ngDevMode.tNode++;
const parent =
- isParent ? previousOrParentTNode : previousOrParentTNode && previousOrParentTNode.parent;
+ getIsParent() ? previousOrParentTNode : previousOrParentTNode && previousOrParentTNode.parent;
// Parents cannot cross component boundaries because components will be used in multiple places,
// so it's only set if the view is the same.
@@ -1425,6 +1003,7 @@ export function createTNode(
index: adjustedIndex,
injectorIndex: tParent ? tParent.injectorIndex : -1,
flags: 0,
+ providerIndexes: 0,
tagName: tagName,
attrs: attrs,
localNames: null,
@@ -1445,7 +1024,7 @@ export function createTNode(
* Given a list of directive indices and minified input names, sets the
* input properties on the corresponding directives.
*/
-function setInputsForProperty(inputs: PropertyAliasValue, value: any): void {
+function setInputsForProperty(viewData: LViewData, inputs: PropertyAliasValue, value: any): void {
for (let i = 0; i < inputs.length; i += 2) {
ngDevMode && assertDataInRange(inputs[i] as number, viewData);
viewData[inputs[i] as number][inputs[i + 1]] = value;
@@ -1461,6 +1040,7 @@ function setInputsForProperty(inputs: PropertyAliasValue, value: any): void {
*/
function generatePropertyAliases(
tNodeFlags: TNodeFlags, direction: BindingDirection): PropertyAliases|null {
+ const tView = getTView();
const count = tNodeFlags & TNodeFlags.DirectiveCountMask;
let propStore: PropertyAliases|null = null;
@@ -1502,7 +1082,7 @@ export function elementClassProp(
index: number, stylingIndex: number, value: boolean | PlayerFactory): void {
const val =
(value instanceof BoundPlayerFactory) ? (value as BoundPlayerFactory) : (!!value);
- updateElementClassProp(getStylingContext(index, viewData), stylingIndex, val);
+ updateElementClassProp(getStylingContext(index, getViewData()), stylingIndex, val);
}
/**
@@ -1537,7 +1117,7 @@ export function elementStyling(
classDeclarations?: (string | boolean | InitialStylingFlags)[] | null,
styleDeclarations?: (string | boolean | InitialStylingFlags)[] | null,
styleSanitizer?: StyleSanitizeFn | null): void {
- const tNode = previousOrParentTNode;
+ const tNode = getPreviousOrParentTNode();
const inputData = initializeTNodeInputs(tNode);
if (!tNode.stylingTemplate) {
@@ -1555,9 +1135,9 @@ export function elementStyling(
classDeclarations && classDeclarations.length) {
const index = tNode.index - HEADER_OFFSET;
if (delegateToClassInput(tNode)) {
- const stylingContext = getStylingContext(index, viewData);
+ const stylingContext = getStylingContext(index, getViewData());
const initialClasses = stylingContext[StylingIndex.PreviousOrCachedMultiClassValue] as string;
- setInputsForProperty(tNode.inputs !['class'] !, initialClasses);
+ setInputsForProperty(getViewData(), tNode.inputs !['class'] !, initialClasses);
}
elementStylingApply(index);
}
@@ -1579,8 +1159,9 @@ export function elementStyling(
* index.)
*/
export function elementStylingApply(index: number): void {
+ const viewData = getViewData();
const totalPlayersQueued =
- renderStyleAndClassBindings(getStylingContext(index, viewData), renderer, viewData);
+ renderStyleAndClassBindings(getStylingContext(index, viewData), getRenderer(), viewData);
if (totalPlayersQueued > 0) {
const rootContext = getRootContext(viewData);
scheduleTick(rootContext, RootContextFlags.FlushPlayers);
@@ -1624,7 +1205,7 @@ export function elementStyleProp(
valueToAdd = value as any as string;
}
}
- updateElementStyleProp(getStylingContext(index, viewData), styleIndex, valueToAdd);
+ updateElementStyleProp(getStylingContext(index, getViewData()), styleIndex, valueToAdd);
}
/**
@@ -1651,13 +1232,14 @@ export function elementStyleProp(
export function elementStylingMap(
index: number, classes: {[key: string]: any} | string | NO_CHANGE | null,
styles?: {[styleName: string]: any} | NO_CHANGE | null): void {
+ const viewData = getViewData();
const tNode = getTNode(index, viewData);
const stylingContext = getStylingContext(index, viewData);
if (delegateToClassInput(tNode) && classes !== NO_CHANGE) {
const initialClasses = stylingContext[StylingIndex.PreviousOrCachedMultiClassValue] as string;
const classInputVal =
(initialClasses.length ? (initialClasses + ' ') : '') + (classes as string);
- setInputsForProperty(tNode.inputs !['class'] !, classInputVal);
+ setInputsForProperty(getViewData(), tNode.inputs !['class'] !, classInputVal);
}
updateStylingMap(stylingContext, classes, styles);
}
@@ -1673,15 +1255,16 @@ export function elementStylingMap(
* @param value Value to write. This value will be stringified.
*/
export function text(index: number, value?: any): void {
+ const viewData = getViewData();
ngDevMode && assertEqual(
- viewData[BINDING_INDEX], tView.bindingStartIndex,
+ viewData[BINDING_INDEX], getTView().bindingStartIndex,
'text nodes should be created before any bindings');
ngDevMode && ngDevMode.rendererCreateTextNode++;
- const textNative = createTextNode(value, renderer);
+ const textNative = createTextNode(value, getRenderer());
const tNode = createNodeAtIndex(index, TNodeType.Element, textNative, null, null);
// Text nodes are self closing.
- isParent = false;
+ setIsParent(false);
appendChild(textNative, tNode, viewData);
}
@@ -1695,9 +1278,10 @@ export function text(index: number, value?: any): void {
export function textBinding(index: number, value: T | NO_CHANGE): void {
if (value !== NO_CHANGE) {
ngDevMode && assertDataInRange(index + HEADER_OFFSET);
- const element = getNativeByIndex(index, viewData) as any as RText;
+ const element = getNativeByIndex(index, getViewData()) as any as RText;
ngDevMode && assertDefined(element, 'native element should exist');
ngDevMode && ngDevMode.rendererSetText++;
+ const renderer = getRenderer();
isProceduralRenderer(renderer) ? renderer.setValue(element, stringify(value)) :
element.textContent = stringify(value);
}
@@ -1708,43 +1292,274 @@ export function textBinding(index: number, value: T | NO_CHANGE): void {
//////////////////////////
/**
- * Create a directive and their associated content queries.
- *
- * NOTE: directives can be created in order other than the index order. They can also
- * be retrieved before they are created in which case the value will be null.
- *
- * @param directive The directive instance.
- * @param directiveDef DirectiveDef object which contains information about the template.
+ * Instantiate a root component.
*/
-export function directiveCreate(
- directiveDefIdx: number, directive: T, directiveDef: DirectiveDef| ComponentDef): T {
- const native = getNativeByTNode(previousOrParentTNode, viewData);
- const instance = baseDirectiveCreate(directiveDefIdx, directive, directiveDef, native);
+export function instantiateRootComponent(
+ tView: TView, viewData: LViewData, def: ComponentDef): T {
+ if (getFirstTemplatePass()) {
+ if (def.providersResolver) def.providersResolver(def);
+ baseResolveDirective(tView, viewData, def, def.factory);
+ }
+ const previousOrParentTNode = getPreviousOrParentTNode();
+ const directive = getNodeInjectable(
+ tView.data, viewData, viewData.length - 1, previousOrParentTNode as TElementNode);
+ postProcessBaseDirective(viewData, previousOrParentTNode, directive, def as DirectiveDef);
+ return directive;
+}
- if ((directiveDef as ComponentDef).template) {
+/**
+ * Resolve the matched directives on a node.
+ */
+function resolveDirectives(
+ tView: TView, viewData: LViewData, directives: DirectiveDef[] | null, tNode: TNode,
+ localRefs: string[] | null): void {
+ // Please make sure to have explicit type for `exportsMap`. Inferred type triggers bug in tsickle.
+ ngDevMode && assertEqual(getFirstTemplatePass(), true, 'should run on first template pass only');
+ const exportsMap: ({[key: string]: number} | null) = localRefs ? {'': -1} : null;
+ generateExpandoInstructionBlock(tView, tNode, directives);
+ let totalHostVars = 0;
+ if (directives) {
+ initNodeFlags(tNode, tView.data.length, directives.length);
+ // When the same token is provided by several directives on the same node, some rules apply in
+ // the viewEngine:
+ // - viewProviders have priority over providers
+ // - the last directive in NgModule.declarations has priority over the previous one
+ // So to match these rules, the order in which providers are added in the arrays is very
+ // important.
+ for (let i = 0; i < directives.length; i++) {
+ const def = directives[i] as DirectiveDef;
+ if (def.providersResolver) def.providersResolver(def);
+ }
+ for (let i = 0; i < directives.length; i++) {
+ const def = directives[i] as DirectiveDef;
+
+ const directiveDefIdx = tView.data.length;
+ baseResolveDirective(tView, viewData, def, def.factory);
+
+ totalHostVars += def.hostVars;
+ saveNameToExportMap(tView.data !.length - 1, def, exportsMap);
+
+ // Init hooks are queued now so ngOnInit is called in host components before
+ // any projected components.
+ queueInitHooks(directiveDefIdx, def.onInit, def.doCheck, tView);
+ }
+ }
+ if (exportsMap) cacheMatchingLocalNames(tNode, localRefs, exportsMap);
+ prefillHostVars(tView, viewData, totalHostVars);
+}
+
+/**
+ * Instantiate all the directives that were previously resolved on the current node.
+ */
+function instantiateAllDirectives(tView: TView, viewData: LViewData, previousOrParentTNode: TNode) {
+ const start = previousOrParentTNode.flags >> TNodeFlags.DirectiveStartingIndexShift;
+ const end = start + previousOrParentTNode.flags & TNodeFlags.DirectiveCountMask;
+ if (!getFirstTemplatePass() && start < end) {
+ getOrCreateNodeInjectorForNode(
+ previousOrParentTNode as TElementNode | TContainerNode | TElementContainerNode, viewData);
+ }
+ for (let i = start; i < end; i++) {
+ const def = tView.data[i] as DirectiveDef;
+ if (isComponentDef(def)) {
+ addComponentLogic(viewData, previousOrParentTNode, def as ComponentDef);
+ }
+ const directive =
+ getNodeInjectable(tView.data, viewData !, i, previousOrParentTNode as TElementNode);
+ postProcessDirective(viewData, directive, def, i);
+ }
+}
+
+/**
+* Generates a new block in TView.expandoInstructions for this node.
+*
+* Each expando block starts with the element index (turned negative so we can distinguish
+* it from the hostVar count) and the directive count. See more in VIEW_DATA.md.
+*/
+function generateExpandoInstructionBlock(
+ tView: TView, tNode: TNode, directives: DirectiveDef[] | null): void {
+ const directiveCount = directives ? directives.length : 0;
+ const elementIndex = -(tNode.index - HEADER_OFFSET);
+ if (directiveCount > 0) {
+ (tView.expandoInstructions || (tView.expandoInstructions = [
+ ])).push(elementIndex, directiveCount);
+ }
+}
+
+/**
+* On the first template pass, we need to reserve space for host binding values
+* after directives are matched (so all directives are saved, then bindings).
+* Because we are updating the blueprint, we only need to do this once.
+*/
+export function prefillHostVars(tView: TView, viewData: LViewData, totalHostVars: number): void {
+ for (let i = 0; i < totalHostVars; i++) {
+ viewData.push(NO_CHANGE);
+ tView.blueprint.push(NO_CHANGE);
+ tView.data.push(null);
+ }
+}
+
+/**
+ * Process a directive on the current node after its creation.
+ */
+function postProcessDirective(
+ viewData: LViewData, directive: T, def: DirectiveDef, directiveDefIdx: number): void {
+ const previousOrParentTNode = getPreviousOrParentTNode();
+ postProcessBaseDirective(viewData, previousOrParentTNode, directive, def);
+ ngDevMode && assertDefined(previousOrParentTNode, 'previousOrParentTNode');
+ if (previousOrParentTNode && previousOrParentTNode.attrs) {
+ setInputsFromAttrs(directiveDefIdx, directive, def.inputs, previousOrParentTNode);
+ }
+
+ if (def.contentQueries) {
+ def.contentQueries(directiveDefIdx);
+ }
+
+ if (isComponentDef(def)) {
const componentView = getComponentViewByIndex(previousOrParentTNode.index, viewData);
componentView[CONTEXT] = directive;
}
-
- if (firstTemplatePass) {
- // Init hooks are queued now so ngOnInit is called in host components before
- // any projected components.
- queueInitHooks(directiveDefIdx, directiveDef.onInit, directiveDef.doCheck, tView);
- }
-
- ngDevMode && assertDefined(previousOrParentTNode, 'previousOrParentTNode');
- if (previousOrParentTNode && previousOrParentTNode.attrs) {
- setInputsFromAttrs(directiveDefIdx, instance, directiveDef.inputs, previousOrParentTNode);
- }
-
- if (directiveDef.contentQueries) {
- directiveDef.contentQueries();
- }
-
- return instance;
}
-function addComponentLogic(def: ComponentDef): void {
+/**
+ * A lighter version of postProcessDirective() that is used for the root component.
+ */
+function postProcessBaseDirective(
+ viewData: LViewData, previousOrParentTNode: TNode, directive: T, def: DirectiveDef): void {
+ const native = getNativeByTNode(previousOrParentTNode, viewData);
+
+ ngDevMode && assertEqual(
+ viewData[BINDING_INDEX], getTView().bindingStartIndex,
+ 'directives should be created before any bindings');
+ ngDevMode && assertPreviousIsParent();
+
+ attachPatchData(directive, viewData);
+ if (native) {
+ attachPatchData(native, viewData);
+ }
+
+ // TODO(misko): setUpAttributes should be a feature for better treeshakability.
+ if (def.attributes != null && previousOrParentTNode.type == TNodeType.Element) {
+ setUpAttributes(native as RElement, def.attributes as string[]);
+ }
+}
+
+
+
+/**
+* Matches the current node against all available selectors.
+* If a component is matched (at most one), it is returned in first position in the array.
+*/
+function findDirectiveMatches(tView: TView, viewData: LViewData, tNode: TNode): DirectiveDef[]|
+ null {
+ ngDevMode && assertEqual(getFirstTemplatePass(), true, 'should run on first template pass only');
+ const registry = tView.directiveRegistry;
+ let matches: any[]|null = null;
+ if (registry) {
+ for (let i = 0; i < registry.length; i++) {
+ const def = registry[i] as ComponentDef| DirectiveDef;
+ if (isNodeMatchingSelectorList(tNode, def.selectors !)) {
+ matches || (matches = []);
+ diPublicInInjector(
+ getOrCreateNodeInjectorForNode(
+ getPreviousOrParentTNode() as TElementNode | TContainerNode | TElementContainerNode,
+ viewData),
+ viewData, def.type);
+
+ if (isComponentDef(def)) {
+ if (tNode.flags & TNodeFlags.isComponent) throwMultipleComponentError(tNode);
+ tNode.flags = TNodeFlags.isComponent;
+
+ // The component is always stored first with directives after.
+ matches.unshift(def);
+ } else {
+ matches.push(def);
+ }
+ }
+ }
+ }
+ return matches;
+}
+
+/** Stores index of component's host element so it will be queued for view refresh during CD. */
+function queueComponentIndexForCheck(previousOrParentTNode: TNode): void {
+ ngDevMode &&
+ assertEqual(getFirstTemplatePass(), true, 'Should only be called in first template pass.');
+ const tView = getTView();
+ (tView.components || (tView.components = [])).push(previousOrParentTNode.index);
+}
+
+/** Stores index of directive and host element so it will be queued for binding refresh during CD.
+*/
+function queueHostBindingForCheck(tView: TView, def: DirectiveDef| ComponentDef): void {
+ ngDevMode &&
+ assertEqual(getFirstTemplatePass(), true, 'Should only be called in first template pass.');
+ tView.expandoInstructions !.push(def.hostBindings !, def.hostVars);
+}
+
+/** Caches local names and their matching directive indices for query and template lookups. */
+function cacheMatchingLocalNames(
+ tNode: TNode, localRefs: string[] | null, exportsMap: {[key: string]: number}): void {
+ if (localRefs) {
+ const localNames: (string | number)[] = tNode.localNames = [];
+
+ // Local names must be stored in tNode in the same order that localRefs are defined
+ // in the template to ensure the data is loaded in the same slots as their refs
+ // in the template (for template queries).
+ for (let i = 0; i < localRefs.length; i += 2) {
+ const index = exportsMap[localRefs[i + 1]];
+ if (index == null) throw new Error(`Export of name '${localRefs[i + 1]}' not found!`);
+ localNames.push(localRefs[i], index);
+ }
+ }
+}
+
+/**
+* Builds up an export map as directives are created, so local refs can be quickly mapped
+* to their directive instances.
+*/
+function saveNameToExportMap(
+ index: number, def: DirectiveDef| ComponentDef,
+ exportsMap: {[key: string]: number} | null) {
+ if (exportsMap) {
+ if (def.exportAs) exportsMap[def.exportAs] = index;
+ if ((def as ComponentDef).template) exportsMap[''] = index;
+ }
+}
+
+/**
+ * Initializes the flags on the current node, setting all indices to the initial index,
+ * the directive count to 0, and adding the isComponent flag.
+ * @param index the initial index
+ */
+export function initNodeFlags(tNode: TNode, index: number, numberOfDirectives: number) {
+ ngDevMode && assertEqual(getFirstTemplatePass(), true, 'expected firstTemplatePass to be true');
+ const flags = tNode.flags;
+ ngDevMode && assertEqual(
+ flags === 0 || flags === TNodeFlags.isComponent, true,
+ 'expected node flags to not be initialized');
+
+ ngDevMode && assertNotEqual(
+ numberOfDirectives, TNodeFlags.DirectiveCountMask,
+ 'Reached the max number of directives');
+ // When the first directive is created on a node, save the index
+ tNode.flags = index << TNodeFlags.DirectiveStartingIndexShift | flags & TNodeFlags.isComponent |
+ numberOfDirectives;
+ tNode.providerIndexes = index;
+}
+
+function baseResolveDirective(
+ tView: TView, viewData: LViewData, def: DirectiveDef,
+ directiveFactory: (t: Type| null) => any) {
+ tView.data.push(def);
+ const nodeInjectorFactory = new NodeInjectorFactory(directiveFactory, isComponentDef(def), null);
+ tView.blueprint.push(nodeInjectorFactory);
+ viewData.push(nodeInjectorFactory);
+
+ if (def.hostBindings) queueHostBindingForCheck(tView, def);
+}
+
+function addComponentLogic(
+ viewData: LViewData, previousOrParentTNode: TNode, def: ComponentDef): void {
const native = getNativeByTNode(previousOrParentTNode, viewData);
const tView = getOrCreateTView(
@@ -1755,7 +1570,7 @@ function addComponentLogic(def: ComponentDef): void {
const componentView = addToViewTree(
viewData, previousOrParentTNode.index as number,
createLViewData(
- rendererFactory.createRenderer(native as RElement, def), tView, null,
+ getRendererFactory().createRenderer(native as RElement, def), tView, null,
def.onPush ? LViewFlags.Dirty : LViewFlags.CheckAlways, getCurrentSanitizer()));
componentView[HOST_NODE] = previousOrParentTNode as TElementNode;
@@ -1765,65 +1580,11 @@ function addComponentLogic(def: ComponentDef): void {
componentView[HOST] = viewData[previousOrParentTNode.index];
viewData[previousOrParentTNode.index] = componentView;
- if (firstTemplatePass) {
- queueComponentIndexForCheck();
- previousOrParentTNode.flags =
- viewData.length << TNodeFlags.DirectiveStartingIndexShift | TNodeFlags.isComponent;
+ if (getFirstTemplatePass()) {
+ queueComponentIndexForCheck(previousOrParentTNode);
}
}
-/**
- * A lighter version of directiveCreate() that is used for the root component
- *
- * This version does not contain features that we don't already support at root in
- * current Angular. Example: local refs and inputs on root component.
- */
-export function baseDirectiveCreate(
- index: number, directive: T, directiveDef: DirectiveDef| ComponentDef,
- native: RNode | null): T {
- ngDevMode && assertEqual(
- viewData[BINDING_INDEX], tView.bindingStartIndex,
- 'directives should be created before any bindings');
- ngDevMode && assertPreviousIsParent();
-
- attachPatchData(directive, viewData);
- if (native) {
- attachPatchData(native, viewData);
- }
-
- viewData[index] = directive;
-
- if (firstTemplatePass) {
- const flags = previousOrParentTNode.flags;
- if (flags === 0) {
- // When the first directive is created:
- // - save the index,
- // - set the number of directives to 1
- previousOrParentTNode.flags =
- index << TNodeFlags.DirectiveStartingIndexShift | flags & TNodeFlags.isComponent | 1;
- } else {
- // Only need to bump the size when subsequent directives are created
- ngDevMode && assertNotEqual(
- flags & TNodeFlags.DirectiveCountMask, TNodeFlags.DirectiveCountMask,
- 'Reached the max number of directives');
- previousOrParentTNode.flags++;
- }
-
- tView.data.push(directiveDef);
- tView.blueprint.push(null);
- if (directiveDef.hostBindings) queueHostBindingForCheck(index, directiveDef);
- } else {
- const diPublic = directiveDef !.diPublic;
- if (diPublic) diPublic(directiveDef !);
- }
-
- if (directiveDef !.attributes != null && previousOrParentTNode.type == TNodeType.Element) {
- setUpAttributes(native as RElement, directiveDef !.attributes as string[]);
- }
-
- return directive;
-}
-
/**
* Sets initial input properties on directive instances from attribute data
*
@@ -1942,19 +1703,24 @@ export function template(
index: number, templateFn: ComponentTemplate| null, consts: number, vars: number,
tagName?: string | null, attrs?: TAttributes | null, localRefs?: string[] | null,
localRefExtractor?: LocalRefExtractor) {
+ const viewData = getViewData();
+ const tView = getTView();
// TODO: consider a separate node type for templates
const tNode = containerInternal(index, tagName || null, attrs || null);
- if (firstTemplatePass) {
+ if (getFirstTemplatePass()) {
tNode.tViews = createTView(
-1, templateFn, consts, vars, tView.directiveRegistry, tView.pipeRegistry, null);
}
- createDirectivesAndLocals(localRefs, localRefExtractor);
- currentQueries &&
- (currentQueries = currentQueries.addNode(previousOrParentTNode as TContainerNode));
+ createDirectivesAndLocals(tView, viewData, localRefs, localRefExtractor);
+ const currentQueries = getCurrentQueries();
+ const previousOrParentTNode = getPreviousOrParentTNode();
+ if (currentQueries) {
+ setCurrentQueries(currentQueries.addNode(previousOrParentTNode as TContainerNode));
+ }
queueLifecycleHooks(tNode.flags, tView);
- isParent = false;
+ setIsParent(false);
}
/**
@@ -1968,18 +1734,19 @@ export function template(
*/
export function container(index: number): void {
const tNode = containerInternal(index, null, null);
- firstTemplatePass && (tNode.tViews = []);
- isParent = false;
+ getFirstTemplatePass() && (tNode.tViews = []);
+ setIsParent(false);
}
function containerInternal(
index: number, tagName: string | null, attrs: TAttributes | null): TNode {
+ const viewData = getViewData();
ngDevMode && assertEqual(
- viewData[BINDING_INDEX], tView.bindingStartIndex,
+ viewData[BINDING_INDEX], getTView().bindingStartIndex,
'container nodes should be created before any bindings');
const adjustedIndex = index + HEADER_OFFSET;
- const comment = renderer.createComment(ngDevMode ? 'container' : '');
+ const comment = getRenderer().createComment(ngDevMode ? 'container' : '');
ngDevMode && ngDevMode.rendererCreateComment++;
const tNode = createNodeAtIndex(index, TNodeType.Container, comment, tagName, attrs);
const lContainer = viewData[adjustedIndex] =
@@ -1991,12 +1758,13 @@ function containerInternal(
// because views can be removed and re-inserted.
addToViewTree(viewData, index + HEADER_OFFSET, lContainer);
+ const currentQueries = getCurrentQueries();
if (currentQueries) {
// prepare place for matching nodes from views inserted into a given container
lContainer[QUERIES] = currentQueries.container();
}
- ngDevMode && assertNodeType(previousOrParentTNode, TNodeType.Container);
+ ngDevMode && assertNodeType(getPreviousOrParentTNode(), TNodeType.Container);
return tNode;
}
@@ -2006,17 +1774,20 @@ function containerInternal(
* @param index The index of the container in the data array
*/
export function containerRefreshStart(index: number): void {
- previousOrParentTNode = loadInternal(index, tView.data) as TNode;
+ const viewData = getViewData();
+ const tView = getTView();
+ let previousOrParentTNode = loadInternal(index, tView.data) as TNode;
+ setPreviousOrParentTNode(previousOrParentTNode);
ngDevMode && assertNodeType(previousOrParentTNode, TNodeType.Container);
- isParent = true;
+ setIsParent(true);
viewData[index + HEADER_OFFSET][ACTIVE_INDEX] = 0;
- if (!checkNoChangesMode) {
+ if (!getCheckNoChangesMode()) {
// We need to execute init hooks here so ngOnInit hooks are called in top level views
// before they are called in embedded views (for backwards compatibility).
- executeInitHooks(viewData, tView, creationMode);
+ executeInitHooks(viewData, tView, getCreationMode());
}
}
@@ -2026,17 +1797,19 @@ export function containerRefreshStart(index: number): void {
* Marking the end of LContainer is the time when to child views get inserted or removed.
*/
export function containerRefreshEnd(): void {
- if (isParent) {
- isParent = false;
+ let previousOrParentTNode = getPreviousOrParentTNode();
+ if (getIsParent()) {
+ setIsParent(false);
} else {
ngDevMode && assertNodeType(previousOrParentTNode, TNodeType.View);
ngDevMode && assertHasParent();
previousOrParentTNode = previousOrParentTNode.parent !;
+ setPreviousOrParentTNode(previousOrParentTNode);
}
ngDevMode && assertNodeType(previousOrParentTNode, TNodeType.Container);
- const lContainer = viewData[previousOrParentTNode.index];
+ const lContainer = getViewData()[previousOrParentTNode.index];
const nextIndex = lContainer[ACTIVE_INDEX];
// remove extra views at the end of the container
@@ -2093,7 +1866,7 @@ function scanForView(
} else {
// found a view with id greater than the one we are searching for
// which means that required view doesn't exist and can't be found at
- // later positions in the views array - stop the search here
+ // later positions in the views array - stop the searchdef.cont here
break;
}
}
@@ -2107,24 +1880,25 @@ function scanForView(
* @return boolean Whether or not this view is in creation mode
*/
export function embeddedViewStart(viewBlockId: number, consts: number, vars: number): RenderFlags {
+ const viewData = getViewData();
+ const previousOrParentTNode = getPreviousOrParentTNode();
// The previous node can be a view node if we are processing an inline for loop
const containerTNode = previousOrParentTNode.type === TNodeType.View ?
previousOrParentTNode.parent ! :
previousOrParentTNode;
const lContainer = viewData[containerTNode.index] as LContainer;
- const currentView = viewData;
ngDevMode && assertNodeType(containerTNode, TNodeType.Container);
let viewToRender = scanForView(
lContainer, containerTNode as TContainerNode, lContainer[ACTIVE_INDEX] !, viewBlockId);
if (viewToRender) {
- isParent = true;
+ setIsParent(true);
enterView(viewToRender, viewToRender[TVIEW].node);
} else {
// When we create a new LView, we always reset the state of the instructions.
viewToRender = createLViewData(
- renderer,
+ getRenderer(),
getOrCreateEmbeddedTView(viewBlockId, consts, vars, containerTNode as TContainerNode), null,
LViewFlags.CheckAlways, getCurrentSanitizer());
@@ -2136,9 +1910,9 @@ export function embeddedViewStart(viewBlockId: number, consts: number, vars: num
enterView(viewToRender, viewToRender[TVIEW].node);
}
if (lContainer) {
- if (creationMode) {
+ if (getCreationMode()) {
// it is a new view, insert it into collection of views for a given container
- insertView(viewToRender, lContainer, currentView, lContainer[ACTIVE_INDEX] !, -1);
+ insertView(viewToRender, lContainer, viewData, lContainer[ACTIVE_INDEX] !, -1);
}
lContainer[ACTIVE_INDEX] !++;
}
@@ -2160,6 +1934,7 @@ export function embeddedViewStart(viewBlockId: number, consts: number, vars: num
*/
function getOrCreateEmbeddedTView(
viewIndex: number, consts: number, vars: number, parent: TContainerNode): TView {
+ const tView = getTView();
ngDevMode && assertNodeType(parent, TNodeType.Container);
const containerTViews = parent.tViews as TView[];
ngDevMode && assertDefined(containerTViews, 'TView expected');
@@ -2173,11 +1948,12 @@ function getOrCreateEmbeddedTView(
/** Marks the end of an embedded view. */
export function embeddedViewEnd(): void {
+ const viewData = getViewData();
const viewHost = viewData[HOST_NODE];
- refreshDescendantViews();
+ refreshDescendantViews(viewData);
leaveView(viewData[PARENT] !);
- previousOrParentTNode = viewHost !;
- isParent = false;
+ setPreviousOrParentTNode(viewHost !);
+ setIsParent(false);
}
/////////////
@@ -2190,8 +1966,8 @@ export function embeddedViewEnd(): void {
export function componentRefresh(
adjustedElementIndex: number, parentFirstTemplatePass: boolean): void {
ngDevMode && assertDataInRange(adjustedElementIndex);
- const hostView = getComponentViewByIndex(adjustedElementIndex, viewData);
- ngDevMode && assertNodeType(tView.data[adjustedElementIndex] as TNode, TNodeType.Element);
+ const hostView = getComponentViewByIndex(adjustedElementIndex, getViewData());
+ ngDevMode && assertNodeType(getTView().data[adjustedElementIndex] as TNode, TNodeType.Element);
// Only attached CheckAlways components or attached, dirty OnPush components should be checked
if (viewAttached(hostView) && hostView[FLAGS] & (LViewFlags.CheckAlways | LViewFlags.Dirty)) {
@@ -2260,7 +2036,7 @@ export function viewAttached(view: LViewData): boolean {
* @param rawSelectors A collection of CSS selectors in the raw, un-parsed form
*/
export function projectionDef(selectors?: CssSelectorList[], textSelectors?: string[]): void {
- const componentNode = findComponentView(viewData)[HOST_NODE] as TElementNode;
+ const componentNode = findComponentView(getViewData())[HOST_NODE] as TElementNode;
if (!componentNode.projection) {
const noOfNodeBuckets = selectors ? selectors.length + 1 : 1;
@@ -2307,6 +2083,7 @@ const projectionNodeStack: (LViewData | TNode)[] = [];
* - 1 based index of the selector from the {@link projectionDef}
*/
export function projection(nodeIndex: number, selectorIndex: number = 0, attrs?: string[]): void {
+ const viewData = getViewData();
const tProjectionNode =
createNodeAtIndex(nodeIndex, TNodeType.Projection, null, null, attrs || null);
@@ -2314,7 +2091,7 @@ export function projection(nodeIndex: number, selectorIndex: number = 0, attrs?:
if (tProjectionNode.projection === null) tProjectionNode.projection = selectorIndex;
// `` has no content
- isParent = false;
+ setIsParent(false);
// re-distribution of projectable nodes is stored on a component's view level
const componentView = findComponentView(viewData);
@@ -2369,6 +2146,8 @@ export function projection(nodeIndex: number, selectorIndex: number = 0, attrs?:
*/
export function addToViewTree(
currentView: LViewData, adjustedHostIndex: number, state: T): T {
+ const tView = getTView();
+ const firstTemplatePass = getFirstTemplatePass();
if (currentView[TAIL]) {
currentView[TAIL] ![NEXT] = state;
} else if (firstTemplatePass) {
@@ -2383,7 +2162,7 @@ export function addToViewTree(
///////////////////////////////
/** If node is an OnPush component, marks its LViewData dirty. */
-export function markDirtyIfOnPush(viewIndex: number): void {
+function markDirtyIfOnPush(viewData: LViewData, viewIndex: number): void {
const view = getComponentViewByIndex(viewIndex, viewData);
if (!(view[FLAGS] & LViewFlags.CheckAlways)) {
view[FLAGS] |= LViewFlags.Dirty;
@@ -2391,7 +2170,7 @@ export function markDirtyIfOnPush(viewIndex: number): void {
}
/** Wraps an event listener with preventDefault behavior. */
-export function wrapListenerWithPreventDefault(listenerFn: (e?: any) => any): EventListener {
+function wrapListenerWithPreventDefault(listenerFn: (e?: any) => any): EventListener {
return function wrapListenerIn_preventDefault(e: Event) {
if (listenerFn(e) === false) {
e.preventDefault();
@@ -2513,11 +2292,11 @@ export function detectChangesInRootView(lViewData: LViewData): void {
* introduce other changes.
*/
export function checkNoChanges(component: T): void {
- checkNoChangesMode = true;
+ setCheckNoChangesMode(true);
try {
detectChanges(component);
} finally {
- checkNoChangesMode = false;
+ setCheckNoChangesMode(false);
}
}
@@ -2531,11 +2310,11 @@ export function checkNoChanges(component: T): void {
* @param lViewData The view which the change detection should be checked on.
*/
export function checkNoChangesInRootView(lViewData: LViewData): void {
- checkNoChangesMode = true;
+ setCheckNoChangesMode(true);
try {
detectChangesInRootView(lViewData);
} finally {
- checkNoChangesMode = false;
+ setCheckNoChangesMode(false);
}
}
@@ -2550,7 +2329,7 @@ export function detectChangesInternal(hostView: LViewData, component: T) {
namespaceHTML();
createViewQuery(viewQuery, hostView[FLAGS], component);
templateFn(getRenderFlags(hostView), component);
- refreshDescendantViews();
+ refreshDescendantViews(hostView);
updateViewQuery(viewQuery, component);
} finally {
leaveView(oldView);
@@ -2600,7 +2379,7 @@ export function markDirty(component: T) {
* @param value Value to diff
*/
export function bind(value: T): T|NO_CHANGE {
- return bindingUpdated(viewData[BINDING_INDEX]++, value) ? value : NO_CHANGE;
+ return bindingUpdated(getViewData()[BINDING_INDEX]++, value) ? value : NO_CHANGE;
}
/**
@@ -2622,7 +2401,7 @@ export function interpolationV(values: any[]): string|NO_CHANGE {
for (let i = 1; i < values.length; i += 2) {
// Check if bindings (odd indexes) have changed
- bindingUpdated(viewData[BINDING_INDEX]++, values[i]) && (different = true);
+ bindingUpdated(getViewData()[BINDING_INDEX]++, values[i]) && (different = true);
}
if (!different) {
@@ -2646,13 +2425,14 @@ export function interpolationV(values: any[]): string|NO_CHANGE {
* @param suffix static value used for concatenation only.
*/
export function interpolation1(prefix: string, v0: any, suffix: string): string|NO_CHANGE {
- const different = bindingUpdated(viewData[BINDING_INDEX]++, v0);
+ const different = bindingUpdated(getViewData()[BINDING_INDEX]++, v0);
return different ? prefix + stringify(v0) + suffix : NO_CHANGE;
}
/** Creates an interpolation binding with 2 expressions. */
export function interpolation2(
prefix: string, v0: any, i0: string, v1: any, suffix: string): string|NO_CHANGE {
+ const viewData = getViewData();
const different = bindingUpdated2(viewData[BINDING_INDEX], v0, v1);
viewData[BINDING_INDEX] += 2;
@@ -2663,6 +2443,7 @@ export function interpolation2(
export function interpolation3(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, suffix: string): string|
NO_CHANGE {
+ const viewData = getViewData();
const different = bindingUpdated3(viewData[BINDING_INDEX], v0, v1, v2);
viewData[BINDING_INDEX] += 3;
@@ -2674,6 +2455,7 @@ export function interpolation3(
export function interpolation4(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string, v3: any,
suffix: string): string|NO_CHANGE {
+ const viewData = getViewData();
const different = bindingUpdated4(viewData[BINDING_INDEX], v0, v1, v2, v3);
viewData[BINDING_INDEX] += 4;
@@ -2687,6 +2469,7 @@ export function interpolation4(
export function interpolation5(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string, v3: any,
i3: string, v4: any, suffix: string): string|NO_CHANGE {
+ const viewData = getViewData();
let different = bindingUpdated4(viewData[BINDING_INDEX], v0, v1, v2, v3);
different = bindingUpdated(viewData[BINDING_INDEX] + 4, v4) || different;
viewData[BINDING_INDEX] += 5;
@@ -2701,6 +2484,7 @@ export function interpolation5(
export function interpolation6(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string, v3: any,
i3: string, v4: any, i4: string, v5: any, suffix: string): string|NO_CHANGE {
+ const viewData = getViewData();
let different = bindingUpdated4(viewData[BINDING_INDEX], v0, v1, v2, v3);
different = bindingUpdated2(viewData[BINDING_INDEX] + 4, v4, v5) || different;
viewData[BINDING_INDEX] += 6;
@@ -2716,6 +2500,7 @@ export function interpolation7(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string, v3: any,
i3: string, v4: any, i4: string, v5: any, i5: string, v6: any, suffix: string): string|
NO_CHANGE {
+ const viewData = getViewData();
let different = bindingUpdated4(viewData[BINDING_INDEX], v0, v1, v2, v3);
different = bindingUpdated3(viewData[BINDING_INDEX] + 4, v4, v5, v6) || different;
viewData[BINDING_INDEX] += 7;
@@ -2731,6 +2516,7 @@ export function interpolation8(
prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string, v3: any,
i3: string, v4: any, i4: string, v5: any, i5: string, v6: any, i6: string, v7: any,
suffix: string): string|NO_CHANGE {
+ const viewData = getViewData();
let different = bindingUpdated4(viewData[BINDING_INDEX], v0, v1, v2, v3);
different = bindingUpdated4(viewData[BINDING_INDEX] + 4, v4, v5, v6, v7) || different;
viewData[BINDING_INDEX] += 8;
@@ -2743,13 +2529,14 @@ export function interpolation8(
/** Store a value in the `data` at a given `index`. */
export function store(index: number, value: T): void {
+ const tView = getTView();
// We don't store any static data for local variables, so the first time
// we see the template, we should store as null to avoid a sparse array
const adjustedIndex = index + HEADER_OFFSET;
if (adjustedIndex >= tView.data.length) {
tView.data[adjustedIndex] = null;
}
- viewData[adjustedIndex] = value;
+ getViewData()[adjustedIndex] = value;
}
/**
@@ -2761,21 +2548,12 @@ export function store(index: number, value: T): void {
* @param index The index of the local ref in contextViewData.
*/
export function reference(index: number) {
+ const contextViewData = getContextViewData();
return loadInternal(index, contextViewData);
}
-function walkUpViews(nestingLevel: number, currentView: LViewData): LViewData {
- while (nestingLevel > 0) {
- ngDevMode && assertDefined(
- currentView[DECLARATION_VIEW],
- 'Declaration view should be defined if nesting level is greater than 0.');
- currentView = currentView[DECLARATION_VIEW] !;
- nestingLevel--;
- }
- return currentView;
-}
-
export function loadQueryList(queryListIdx: number): QueryList {
+ const viewData = getViewData();
ngDevMode && assertDefined(
viewData[CONTENT_QUERIES],
'Content QueryList array should be defined if reading a query.');
@@ -2786,11 +2564,12 @@ export function loadQueryList(queryListIdx: number): QueryList {
/** Retrieves a value from current `viewData`. */
export function load(index: number): T {
- return loadInternal(index, viewData);
+ return loadInternal(index, getViewData());
}
/** Gets the current binding value. */
export function getBinding(bindingIndex: number): any {
+ const viewData = getViewData();
ngDevMode && assertDataInRange(viewData[bindingIndex]);
ngDevMode &&
assertNotEqual(viewData[bindingIndex], NO_CHANGE, 'Stored value should never be NO_CHANGE.');
@@ -2799,6 +2578,8 @@ export function getBinding(bindingIndex: number): any {
/** Updates binding if changed, then returns whether it was updated. */
export function bindingUpdated(bindingIndex: number, value: any): boolean {
+ const viewData = getViewData();
+ const checkNoChangesMode = getCheckNoChangesMode();
ngDevMode && assertNotEqual(value, NO_CHANGE, 'Incoming value should never be NO_CHANGE.');
ngDevMode && assertLessThan(
bindingIndex, viewData.length, `Slot should have been initialized to NO_CHANGE`);
@@ -2806,7 +2587,7 @@ export function bindingUpdated(bindingIndex: number, value: any): boolean {
if (viewData[bindingIndex] === NO_CHANGE) {
viewData[bindingIndex] = value;
} else if (isDifferent(viewData[bindingIndex], value, checkNoChangesMode)) {
- throwErrorIfNoChangesMode(creationMode, checkNoChangesMode, viewData[bindingIndex], value);
+ throwErrorIfNoChangesMode(getCreationMode(), checkNoChangesMode, viewData[bindingIndex], value);
viewData[bindingIndex] = value;
} else {
return false;
@@ -2816,7 +2597,7 @@ export function bindingUpdated(bindingIndex: number, value: any): boolean {
/** Updates binding and returns the value. */
export function updateBinding(bindingIndex: number, value: any): any {
- return viewData[bindingIndex] = value;
+ return getViewData()[bindingIndex] = value;
}
/** Updates 2 bindings if changed, then returns whether either was updated. */
@@ -2838,19 +2619,59 @@ export function bindingUpdated4(
return bindingUpdated2(bindingIndex + 2, exp3, exp4) || different;
}
-export function getTView(): TView {
- return tView;
+
+///////////////////////////////
+//// DI
+///////////////////////////////
+
+/**
+ * Returns the value associated to the given token from the injectors.
+ *
+ * `directiveInject` is intended to be used for directive, component and pipe factories.
+ * All other injection use `inject` which does not walk the node injector tree.
+ *
+ * Usage example (in factory function):
+ *
+ * class SomeDirective {
+ * constructor(directive: DirectiveA) {}
+ *
+ * static ngDirectiveDef = defineDirective({
+ * type: SomeDirective,
+ * factory: () => new SomeDirective(directiveInject(DirectiveA))
+ * });
+ * }
+ *
+ * @param token the type or token to inject
+ * @param flags Injection flags
+ * @returns the value from the injector or `null` when not found
+ */
+export function directiveInject(token: Type| InjectionToken): T;
+export function directiveInject(token: Type| InjectionToken, flags: InjectFlags): T;
+export function directiveInject(
+ token: Type| InjectionToken, flags = InjectFlags.Default): T|null {
+ return getOrCreateInjectable(
+ getPreviousOrParentTNode() as TElementNode | TContainerNode | TElementContainerNode,
+ getViewData(), token, flags);
+}
+
+/**
+ * Facade for the attribute injection from DI.
+ */
+export function injectAttribute(attrNameToInject: string): string|undefined {
+ return injectAttributeImpl(getPreviousOrParentTNode(), attrNameToInject);
}
/**
* Registers a QueryList, associated with a content query, for later refresh (part of a view
* refresh).
*/
-export function registerContentQuery(queryList: QueryList): void {
+export function registerContentQuery(
+ queryList: QueryList, currentDirectiveIndex: number): void {
+ const viewData = getViewData();
+ const tView = getTView();
const savedContentQueriesLength =
(viewData[CONTENT_QUERIES] || (viewData[CONTENT_QUERIES] = [])).push(queryList);
- if (firstTemplatePass) {
- const currentDirectiveIndex = viewData.length - 1;
+ if (getFirstTemplatePass()) {
const tViewContentQueries = tView.contentQueries || (tView.contentQueries = []);
const lastSavedDirectiveIndex =
tView.contentQueries.length ? tView.contentQueries[tView.contentQueries.length - 2] : -1;
@@ -2860,25 +2681,6 @@ export function registerContentQuery(queryList: QueryList): void {
}
}
-export function assertPreviousIsParent() {
- assertEqual(isParent, true, 'previousOrParentTNode should be a parent');
-}
-
-function assertHasParent() {
- assertDefined(previousOrParentTNode.parent, 'previousOrParentTNode should have a parent');
-}
-
-function assertDataInRange(index: number, arr?: any[]) {
- if (arr == null) arr = viewData;
- assertDataInRangeInternal(index, arr || viewData);
-}
-
-function assertDataNext(index: number, arr?: any[]) {
- if (arr == null) arr = viewData;
- assertEqual(
- arr.length, index, `index ${index} expected to be at the end of arr (length ${arr.length})`);
-}
-
export const CLEAN_PROMISE = _CLEAN_PROMISE;
function initializeTNodeInputs(tNode: TNode | null) {
diff --git a/packages/core/src/render3/interfaces/definition.ts b/packages/core/src/render3/interfaces/definition.ts
index b94b4af1ca..c49550e4ed 100644
--- a/packages/core/src/render3/interfaces/definition.ts
+++ b/packages/core/src/render3/interfaces/definition.ts
@@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
-import {Provider, ViewEncapsulation} from '../../core';
+import {ViewEncapsulation} from '../../core';
import {Type} from '../../type';
import {CssSelectorList} from './projection';
@@ -112,11 +112,11 @@ export interface DirectiveDef extends BaseDef {
/** Token representing the directive. Used by DI. */
type: Type;
- /** Function that makes a directive public to the DI system. */
- diPublic: ((def: DirectiveDef) => void)|null;
+ /** Function that resolves providers and publishes them into the DI system. */
+ providersResolver: ((def: DirectiveDef) => void)|null;
/** The selectors that will be used to match nodes to this directive. */
- selectors: CssSelectorList;
+ readonly selectors: CssSelectorList;
/**
* Name under which the directive is exported (for use with local references in template)
@@ -126,12 +126,12 @@ export interface DirectiveDef extends BaseDef {
/**
* Factory function used to create a new directive instance.
*/
- factory(): T;
+ factory: (t: Type|null) => T;
/**
* Function to create instances of content queries associated with a given directive.
*/
- contentQueries: (() => void)|null;
+ contentQueries: ((directiveIndex: number) => void)|null;
/** Refreshes content queries associated with directives in a given view */
contentQueriesRefresh: ((directiveIndex: number, queryIndex: number) => void)|null;
@@ -142,7 +142,7 @@ export interface DirectiveDef extends BaseDef