using asyncPipe *ngFor item gets any type if the iterable is not an array

[Zorgatone]

Describe the bug

I'm iterating over a Immutable.js list, but the item of the list in the html template is not giving type hints (it's inferred as any type)

To Reproduce

This is my template:

<h1>Todo List</h1>

<ul>
  <li *ngFor="let todo of todoService.todo$ | async">
    {{ todo.title }} <!-- Here I do not get type hints -->
  </li>
</ul>

Todo class:

import { Record } from 'immutable';

export interface TodoContent {
  title: string;
  isDone: boolean;
}

export const defaultTodo: TodoContent = {
  title: '',
  isDone: false,
};

export class Todo extends Record(defaultTodo) implements TodoContent {
  public constructor(content: TodoContent) {
    super(content);

    console.log('Constructed new Todo object with:', content);
  }
}

export default Todo;

Todo Service:

import { Injectable } from '@angular/core';
import { List } from 'immutable';
import { BehaviorSubject, Observable } from 'rxjs';
import { shareReplay } from 'rxjs/operators';

import Todo from '../model/todo';

@Injectable({
  providedIn: 'root',
})
export class TodoService {
  private _todoSubject: BehaviorSubject<List<Todo>>;

  private _todo$: Observable<List<Todo>>;

  public constructor() {
    this._todoSubject = new BehaviorSubject(
      List<Todo>([
        new Todo({ title: 'Example 1', isDone: true }),
        new Todo({ title: 'Example 2', isDone: false }),
      ])
    );

    this._todo$ = this._todoSubject.asObservable().pipe(shareReplay(1));
  }

  public get todo$() {
    return this._todo$;
  }

  public addTodo(todo: Todo) {
    const list = this._todoSubject.getValue();

    this._todoSubject.next(list.push(todo));
  }
}

Expected behavior

<h1>Todo List</h1>

<ul>
  <li *ngFor="let todo of todoService.todo$ | async">
    {{ todo.title }} <!-- Here I SHOULD get type hints (infer todo variable as type Todo instead of any) -->
  </li>
</ul>

Logs

N/A

Screenshots

Additional context

If I convert the ngFor expression like this the typing is correct (converting iterable to array):

<li *ngFor="let todo of (todoService.todo$ | async)?.toArray()"><!-- ... --></li>

I'm using vscode-insiders

Version: 1.51.0-insider
Commit: 89c002ab02f87102d91efc83c191ef1174756c6a
Date: 2020-10-15T23:12:18.967Z (2 days ago)
Electron: 9.3.2
Chrome: 83.0.4103.122
Node.js: 12.14.1
V8: 8.3.110.13-electron.0
OS: Darwin x64 19.6.0

And using Angular Language Service vscode extension version v0.1001.0

[ayazhafiz]

This is a known issue (angular/angular#21224) and is fixed by the Ivy language service, which will be beta released in Angular 11 (#335 (comment)). As such, I am closing this report.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}