Angular框架解读--Ivy编译器的视图数据和依赖解析

export interface LView extends Array<any> {
  // 插入该 LView 的节点
  [HOST]: RElement | null;

// 此视图的静态数据
  readonly [TVIEW]: TView;

// 父视图
  [PARENT]: LView | LContainer | null;

// 下一个同级视图或容器
  [NEXT]: LView | LContainer | null;

// 对此视图有效的查询-视图中的节点将报告给这些查询
  [QUERIES]: LQueries | null;

// 存储当前 LView 插入位置的 TNode
  [T_HOST]: TNode | null;

// 当视图被破坏时，需要释放侦听器，并且必须取消订阅输出
  [CLEANUP]: any[] | null;

// 上下文信息
  [CONTEXT]: {} | RootContext | null;

// 在咨询了元素注入器之后，将使用可选的模块注入器作为回退
  readonly [INJECTOR]: Injector | null;

// 用于创建渲染器的工厂
  [RENDERER_FACTORY]: RendererFactory3;

// 要用于此视图的渲染器
  [RENDERER]: Renderer3;

// 引用层次结构中此 LView 下的第一个 LView 或 LContainer
  [CHILD_HEAD]: LView | LContainer | null;

// 层次结构中此 LView 下的最后一个 LView 或 LContainer
  [CHILD_TAIL]: LView | LContainer | null;

// 查看声明此视图的模板的位置
  [DECLARATION_VIEW]: LView | null;

// 指向声明组件视图，用于跟踪已移植的 LView
  [DECLARATION_COMPONENT_VIEW]: LView;

// 嵌入视图的声明点（基于 <ng-template> 的内容实例化的声明点），其他类型的视图为 null
  [DECLARATION_LCONTAINER]: LContainer | null;
}

export class NodeInjector implements Injector {
  constructor(
    private _tNode:
      | TElementNode
      | TContainerNode
      | TElementContainerNode
      | null,
    private _lView: LView
  ) {}

get(token: any, notFoundValue?: any): any {
    return getOrCreateInjectable(
      this._tNode,
      this._lView,
      token,
      undefined,
      notFoundValue
    );
  }
}

export function getOrCreateInjectable<T>(
  tNode: TDirectiveHostNode | null,
  lView: LView,
  token: Type<T> | AbstractType<T> | InjectionToken<T>,
  flags: InjectFlags = InjectFlags.Default,
  notFoundValue?: any
): T | null {
  if (tNode !== null) {
    const bloomHash = bloomHashBitOrFactory(token);
    // 如果此处存储的 ID 是一个函数，则这是一个特殊的对象，例如 ElementRef 或 TemplateRef
    // 因此只需调用 factory 函数即可创建它
    if (typeof bloomHash === "function") {
      if (!enterDI(lView, tNode, flags)) {
        // 无法进入 DI，则尝试使用模块注入器
        // 如果使用 @Host 标志注入令牌，则在 Ivy 中不会在模块注入器中搜索该令牌
        return flags & InjectFlags.Host
          ? notFoundValueOrThrow<T>(notFoundValue, token, flags)
          : lookupTokenUsingModuleInjector<T>(
              lView,
              token,
              flags,
              notFoundValue
            );
      }
      try {
        const value = bloomHash(flags);
        if (value == null && !(flags & InjectFlags.Optional)) {
          throwProviderNotFoundError(token);
        } else {
          return value;
        }
      } finally {
        leaveDI();
      }
    } else if (typeof bloomHash === "number") {
      // 对遍历元素注入器树时找到的上一个注入器 TView 的引用
      // 这用于了解是否可以在当前注射器上访问 viewProviders
      let previousTView: TView | null = null;
      let injectorIndex = getInjectorIndex(tNode, lView);
      let parentLocation: RelativeInjectorLocation = NO_PARENT_INJECTOR;
      let hostTElementNode: TNode | null =
        flags & InjectFlags.Host
          ? lView[DECLARATION_COMPONENT_VIEW][T_HOST]
          : null;

// 如果我们应该跳过此注入器，或者此节点上没有注入器，需先搜索父注入器
      if (injectorIndex === -1 || flags & InjectFlags.SkipSelf) {
        parentLocation =
          injectorIndex === -1
            ? getParentInjectorLocation(tNode, lView)
            : lView[injectorIndex + NodeInjectorOffset.PARENT];

if (
          parentLocation === NO_PARENT_INJECTOR ||
          !shouldSearchParent(flags, false)
        ) {
          injectorIndex = -1;
        } else {
          previousTView = lView[TVIEW];
          injectorIndex = getParentInjectorIndex(parentLocation);
          lView = getParentInjectorView(parentLocation, lView);
        }
      }

// 遍历注入器树，直到找到潜​​在的匹配项，或者直到知道*不是*匹配项为止。
      while (injectorIndex !== -1) {
        ngDevMode && assertNodeInjector(lView, injectorIndex);

// 检查当前的注入器。如果匹配，请查看它是否包含令牌
        const tView = lView[TVIEW];
        ngDevMode &&
          assertTNodeForLView(
            tView.data[injectorIndex + NodeInjectorOffset.TNODE] as TNode,
            lView
          );
        if (bloomHasToken(bloomHash, injectorIndex, tView.data)) {
          // 在这一点上，我们有一个*可能*包含令牌的注入器
          // 因此我们逐步浏览与注入器的相应节点相关联的提供程序和指令以获取实例
          const instance: T | null = searchTokensOnInjector<T>(
            injectorIndex,
            lView,
            token,
            previousTView,
            flags,
            hostTElementNode
          );
          if (instance !== NOT_FOUND) {
            return instance;
          }
        }
        parentLocation = lView[injectorIndex + NodeInjectorOffset.PARENT];
        if (
          parentLocation !== NO_PARENT_INJECTOR &&
          shouldSearchParent(
            flags,
            lView[TVIEW].data[injectorIndex + NodeInjectorOffset.TNODE] ===
              hostTElementNode
          ) &&
          bloomHasToken(bloomHash, injectorIndex, lView)
        ) {
          // 在此节点上的任何位置都找不到 def，因此它是误报。遍历树并继续搜索
          previousTView = tView;
          injectorIndex = getParentInjectorIndex(parentLocation);
          lView = getParentInjectorView(parentLocation, lView);
        } else {
          // 如果我们不应该搜索父对象，或者如果祖先的 bloom 过滤器值没有对应于该指令的位
          // 我们可以放弃遍历以查找特定的注入器
          injectorIndex = -1;
        }
      }
    }
  }

return lookupTokenUsingModuleInjector<T>(lView, token, flags, notFoundValue);
}

@Component({
  selector: "my-app",
  template: `
    <div dirA>
      <div dirB>Hello Ivy</div>
    </div>
  `,
})
export class AppComponent {}

@Directive({ selector: "[dirA]" })
export class DirA {}

@Directive({ selector: "[dirB]" })
export class DirB {
  constructor(private rootComp: AppComponent) {}
}