Function createRootTView

packages/core/src/render3/component_ref.ts:414–500

(
  rootSelectorOrNode: any,
  componentDef: ComponentDef<unknown>,
  componentBindings: Binding[] | undefined,
  directives: (Type<unknown> | DirectiveWithBindings<unknown>)[] | undefined,
)

}

function createRootTView(
  rootSelectorOrNode: any,
  componentDef: ComponentDef<unknown>,
  componentBindings: Binding[] | undefined,
  directives: (Type<unknown> | DirectiveWithBindings<unknown>)[] | undefined,
): TView {
  const tAttributes = rootSelectorOrNode
    ? ['ng-version', '0.0.0-PLACEHOLDER']
    : // Extract attributes and classes from the first selector only to match VE behavior.
      extractAttrsAndClassesFromSelector(componentDef.selectors[0]);
  let creationBindings: Binding[] | null = null;
  let updateBindings: Binding[] | null = null;
  let varsToAllocate = 0;

  if (componentBindings) {
    for (const binding of componentBindings as BindingInternal[]) {
      varsToAllocate += binding[BINDING].requiredVars;

      if (binding.create) {
        (binding as BindingInternal).targetIdx = 0;
        (creationBindings ??= []).push(binding);
      }

      if (binding.update) {
        (binding as BindingInternal).targetIdx = 0;
        (updateBindings ??= []).push(binding);
      }
    }
  }

  if (directives) {
    for (let i = 0; i < directives.length; i++) {
      const directive = directives[i];
      if (typeof directive !== 'function') {
        for (const binding of directive.bindings as BindingInternal[]) {
          varsToAllocate += binding[BINDING].requiredVars;
          const targetDirectiveIdx = i + 1;
          if (binding.create) {
            (binding as BindingInternal).targetIdx = targetDirectiveIdx;
            (creationBindings ??= []).push(binding);
          }

          if (binding.update) {
            (binding as BindingInternal).targetIdx = targetDirectiveIdx;
            (updateBindings ??= []).push(binding);
          }
        }
      }
    }
  }

  const directivesToApply: DirectiveDef<unknown>[] = [componentDef];
  if (directives) {
    for (const directive of directives) {
      const directiveType = typeof directive === 'function' ? directive : directive.type;
      const directiveDef = ngDevMode
        ? getDirectiveDefOrThrow(directiveType)
        : getDirectiveDef(directiveType)!;