Exigences : Les requêtes HTTP sont un processus très long : lorsqu’un utilisateur soumet un formulaire en interface, le backend nécessite diverses vérifications puis une base de données persistante, et les données sont transmises sur le réseau. Lorsqu’un utilisateur soumet un formulaire, nousVous ne voulez pas que l’utilisateur puisse cliquer sur une action de l’interface (ou vous ne voulez pas cliquer sans cesse sur Envoyer).。 Nous avons besoin d’une animation pour le chargement global.
ng-http-loader Ce package fournit un bloqueur HTTP et certains composants spinner (tous issus de SpinKit pour l’instant). Le bloqueur HTTP écoute toutes les requêtes HTTP et affiche un indicateur de rotateur/chargeur lors des requêtes HTTP en attente.
Adresse NPM :La connexion hyperlientérée est visible.
Adresse GitHub :La connexion hyperlientérée est visible.
Installez la version ng-http-loader appropriée selon votre version Angular, en prenant la version Angular 17 comme exemple, la commande installation est la suivante :
Comme je suis un composant autonome, j’ai modifié app.config.ts comme suit :
Pendant ce temps, la composante app.component.ts est modifiée comme suit :
Enfin, modifiez le code app.component.html comme suit :
Les rendus sont les suivants :
Pour des informations sur le chargement des effets de style animation, veuillez vous référer aux éléments suivants :
export const Spinkit = {
skChasingDots : 'sk-chasing-dots',
skCubeGrid : « sk-cube-grid »,
skDoubleBounce : « sk-double-rebond »,
skRotatingPlan : « sk-rotationg-plane »,
skSpinnerPulse : « sk-spinner-pulse »,
skThreeBounce : 'sk-trois-rebond',
skWanderingCubes : « sk-cubes-errants »,
skWave : « sk-wave »
};
|
Publié sur 10/06/2024 15:09:56
|
|
|
|
