Method execute

packages/compiler/src/typecheck/ops/template.ts:61–130

()

  }

  override execute(): null {
    // An `if` will be constructed, within which the template's children will be type checked. The
    // `if` is used for two reasons: it creates a new syntactic scope, isolating variables declared
    // in the template's TCB from the outer context, and it allows any directives on the templates
    // to perform type narrowing of either expressions or the template's context.
    //
    // The guard is the `if` block's condition. It's usually set to `true` but directives that exist
    // on the template can trigger extra guard expressions that serve to narrow types within the
    // `if`. `guard` is calculated by starting with `true` and adding other conditions as needed.
    // Collect these into `guards` by processing the directives.

    // By default the guard is simply `true`.
    let guard: TcbExpr | null = null;
    const directiveGuards: TcbExpr[] = [];

    this.addDirectiveGuards(
      directiveGuards,
      this.template,
      this.tcb.boundTarget.getDirectivesOfNode(this.template),
    );

    for (const directive of this.template.directives) {
      this.addDirectiveGuards(
        directiveGuards,
        directive,
        this.tcb.boundTarget.getDirectivesOfNode(directive),
      );
    }

    // If there are any guards from directives, use them instead.
    if (directiveGuards.length > 0) {
      // Pop the first value and use it as the initializer to reduce(). This way, a single guard
      // will be used on its own, but two or more will be combined into binary AND expressions.
      guard = directiveGuards.reduce(
        (expr, dirGuard) => new TcbExpr(`${expr.print()} && ${dirGuard.print()}`),
        directiveGuards.pop()!,
      );
    }

    // Create a new Scope for the template. This constructs the list of operations for the template
    // children, as well as tracks bindings within the template.
    const tmplScope = this.scope.createChildScope(
      this.scope,
      this.template,
      this.template.children,
      guard,
    );

    // Render the template's `Scope` into its statements.
    const statements = tmplScope.render();
    if (statements.length === 0) {
      // As an optimization, don't generate the scope's block if it has no statements. This is
      // beneficial for templates that contain for example `<span *ngIf="first"></span>`, in which
      // case there's no need to render the `NgIf` guard expression. This seems like a minor
      // improvement, however it reduces the number of flow-node antecedents that TypeScript needs
      // to keep into account for such cases, resulting in an overall reduction of
      // type-checking time.
      return null;