angular animated ghost elements
1.0.0
Иногда называемые «скелетами», призрачные элементы представляют собой серые представления ожидающего пользовательского интерфейса, который будет доступен в будущем; как только асинхронные данные загружены или, возможно, модуль с отложенной загрузкой готов.
Элементы-призраки очень полезны для реализации сложных таблиц и других UX, где загрузка данных нетривиальна.
Хотя многие приложения (особенно Slack и Facebook) включают в себя UX со скелетами и CSS, сообщество разработчиков Angular еще не обсуждало этот метод подробно.
https://angular-animated-ghost-list.firebaseapp.com/
Представления Ghost можно использовать тремя (3) способами:
Для списков и таблиц реализация призрачных элементов может оказаться особенно сложной задачей.
Преимущество (1) заключается в том, что разработчики имеют максимум возможностей для одновременной анимации призрачных и реальных элементов. Особенно для списков, где разработчики могут захотеть располагать элементы как :enter или :leave .
В этом репозитории демонстрируются идеи о том, как секционировать, реализовывать и анимировать призрачные элементы ... реализованные с помощью Angular 7.x и @angular/animations .
1.) Наложение анимированных призраков
2.) Анимированные встроенные призраки
3.) Анимированные призраки + AsyncItem
