Ошибка TS: flatMap, flat, flatten не существуют для типа any[] в Angular

Причина ошибки: настройка target и lib в tsconfig.json

Вы правы, методы Array.prototype.flat() и Array.prototype.flatMap() были добавлены в стандарт ES2019 (ES10). Однако TypeScript по умолчанию часто компилирует код в более старую версию JavaScript (ES5), чтобы обеспечить совместимость со старыми браузерами. В ES5 этих методов нет, поэтому TypeScript не "знает" о них и не включает их типы.

Ошибка Property 'flatMap' does not exist on type 'Order[]' возникает именно из-за того, что в используемом наборе определений типов (lib) эти методы отсутствуют.

Решение 1: Обновить target и lib (рекомендуется для Angular 12+)

Откройте файл tsconfig.json в корне вашего проекта Angular. Найдите секцию compilerOptions и измените (или добавьте) параметры target и lib:

{
  "compilerOptions": {
    "target": "es2019",        // или "es2020", "esnext"
    "lib": ["es2019", "dom"],  // обязательно укажите "es2019" или выше
    // ... остальные настройки
  }
}

Важно:

• target — определяет, в какую версию JS будет транспилирован ваш код. Установка "es2019" заставит TypeScript оставить flatMap как есть (без полифилов).
• lib — список файлов с определениями типов, которые TypeScript будет использовать. Если вы укажете "lib": ["es2019", "dom"], TypeScript "узнает" о методах flat, flatMap, Object.fromEntries и т.д.

После изменения tsconfig.json перезапустите сервер разработки Angular (ng serve). Ошибка должна исчезнуть.

Решение 2: Ручной полифилл (если нужно поддерживать ES5)

Если по требованиям проекта вы обязаны использовать "target": "es5" (например, для поддержки IE11), то просто изменить lib недостаточно — методы не будут работать в старых браузерах. В этом случае нужно:

1. Добавить полифиллы в polyfills.ts (например, через npm пакет core-js).
2. Или написать свою функцию-аналог flatMap:

// Вместо orders.flatMap(order => order.items)
// Используем reduce и concat
const allItems = orders.reduce((acc: string[], order) => {
  return acc.concat(order.items);
}, []);

Этот код будет работать в любой версии JavaScript и TypeScript.

Проверка типов

После исправления tsconfig.json ваш код будет выглядеть так и работать корректно:

getAllItems(): Observable<string[]> {
  return this.http.get<Order[]>('/api/orders').pipe(
    map(orders => orders.flatMap(order => order.items)) // Теперь всё ок
  );
}

Итог

Самое простое и правильное решение для современных проектов Angular — обновить target до es2019 или выше. Это даст вам доступ ко всем новым методам массивов, а также улучшит производительность итогового бандла (меньше кода для транспиляции).

getAllItems(): Observable<string[]> {
  return this.http.get<Order[]>('/api/orders').pipe(
    map(orders => [].concat(...orders.map(order => order.items)))
  );
}