Требования: HTTP-запросы — это очень трудоёмкий процесс: когда пользователь отправляет форму на фронтенде, бэкенду требуется различные проверки, затем постоянная база данных, и данные передаются по сети. Когда пользователь отправляет форму, мыВы не хотите, чтобы пользователь мог кликать по какому-либо действию на интерфейсе (или не хотите, чтобы постоянно нажимать «Отправить»).。 Нам нужна анимация для глобальной загрузки.
ng-http-loader Этот пакет содержит блокировщик HTTP и некоторые компоненты спиннера (пока все из SpinKit). HTTP-блокировщик прослушивает все HTTP-запросы и отображает индикатор ротации/загрузчика во время ожидающих HTTP-запросов.
Адрес NPM:Вход по гиперссылке виден.
Адрес на GitHub:Вход по гиперссылке виден.
Установите соответствующую версию ng-http-loader в соответствии с вашей версией Angular, возьмём в пример версию Angular 17, команда установки выглядит следующим образом:
Поскольку я являюсь самостоятельным компонентом, я изменил app.config.ts следующим образом:
Тем временем компонент app.component.ts модифицируется следующим образом:
Наконец, измените app.component.html код следующим образом:
Визуализации следующие:
Для получения информации о загрузке эффектов в стиле анимации, пожалуйста, обратитесь к следующему:
экспорт Spinkit = {
skChasingDots: 'sk-chasing-dots',
skCubeGrid: 'sk-cube-grid',
skDoubleBounce: 'sk-double-bounce',
skRotatingPlane: 'sk-rotationg-plane',
skSpinnerPulse: 'sk-spinner-pulse',
skThreeBounce: «ск-три-прыжок»,
skWanderingCubes: «ск-блуждающие кубы»,
skWave: 'sk-wave'
};
|
Опубликовано 10.06.2024 15:09:56
|
|
|
|
