Обновить

Angular Hack: Цикл без данных (в тэмплейте)

Иногда нужно отобразить несколько одинаковых элементов чисто для ui-целей: скелетоны загрузки, звёзды рейтинга, пустые таблицы и т.д., но без реальных данных для итерации.

Вот мой способ (по крайней мере, я нигде такого не видел):

@for (_ of [].constructor(10); track $index) {
<div class="item"></div>
}

Используется Array.constructor, чтобы создать пустую массив фиксированной длины, который @for может перебрать по индексам.

Плюсы ✅

  • Чудо-код (удивит коллег)

  • Минимум кода (не нужно объявлять массив в компоненте)

Минусы ⚠️

  • Чудо-код (может ненадолго ввести в ступор чающего код человека)

Конечно, можно просто использовать Array.from({length: 10})... но так все делают, не интересно)

Норм тема? Как считаете?

Теги:
Всего голосов 2: ↑1 и ↓10
Комментарии3

Япония пыталась создать операционную систему для всего мира, но затем вмешалось правительство США

В 1984 году исследователь Токийского университета Кен Сакамура запустил проект TRON (The Real‑time Operating system Nucleus) — инициативу по созданию семейства операционных систем реального времени с открытым исходным кодом ядра. Подпроект BTRON был упомянут в отчёте США о торговых барьерах и фактически закрыт, прежде чем смог попасть в школы по всей Японии. Одновременно с этим подпроект ITRON стал одной из самых распространённых ОС в истории. 

Япония пыталась создать операционную систему для всего мира, но затем вмешалось правительство США

Публикации