ARTICLE AD BOX
In below diagram you can see type checking is working correctly for the signal object, but not for the let object, even though both of them are of same type-

Example on stack blitz- https://stackblitz.com/edit/stackblitz-starters-hynkmzq5?file=src%2Fmain.ts
App Component:
import { Component, computed, signal } from '@angular/core'; import { bootstrapApplication } from '@angular/platform-browser'; import { Child } from './app/child/child'; @Component({ selector: 'app-root', template: ` <app-child [items]="people()"> <ng-template #item let-person> {{ person.doesnotexist }} {{ firstPerson().name }} </ng-template> </app-child> `, imports: [Child], }) export class App { people = signal<Person[]>([ { name: 'Goldberg', age: 27, }, { name: 'John Cena', age: 29, }, ]); firstPerson = computed(() => this.people()[0]); } export interface Person { name: string; age: number; }Child Component:
import { Component, contentChild, effect, input, TemplateRef } from '@angular/core'; import { NgTemplateOutlet } from '@angular/common'; @Component({ selector: 'app-child', imports: [NgTemplateOutlet], template: ` @for(item of items(); track $index) { <ng-container [ngTemplateOutlet]="itemTemplate()" [ngTemplateOutletContext]="{ $implicit: item }" /> } `, styles: ``, }) export class Child<T> { items = input.required<T[]>(); readonly itemTemplate = contentChild.required<TemplateRef<{ $implicit: T }>>('item'); }How to make type checking work for the let object as well?
Ideally I do not want to pass entire array to a directive, just to infer the type in the solution
