Requisiti: Le richieste HTTP sono un processo molto dispendioso in termini di tempo: quando un utente invia un modulo sul frontend, il backend necessita di vari controlli e poi di un database persistente, e i dati vengono trasmessi sulla rete. Quando un utente invia un modulo, noiNon vuoi che l'utente possa cliccare su qualsiasi azione dell'interfaccia (o non vuoi cliccare ripetutamente su Invia).。 Abbiamo bisogno di un'animazione per il caricamento globale.
ng-http-loader Questo pacchetto fornisce un blocco HTTP e alcuni componenti spinner (tutti per ora da SpinKit). Il blocco HTTP ascolta tutte le richieste HTTP e visualizza un indicatore di rotatore/loader durante le richieste HTTP in sospeso.
Indirizzo NPM:Il login del link ipertestuale è visibile.
Indirizzo GitHub:Il login del link ipertestuale è visibile.
Installa la versione appropriata ng-http-loader secondo la tua versione Angular, prendendo come esempio la versione Angular 17, il comando installation è il seguente:
Dato che sono un componente autonomo, ho modificato app.config.ts come segue:
Nel frattempo, la componente app.component.ts viene modificata come segue:
Infine, modificare il codice app.component.html come segue:
Le rappresentazioni sono le seguenti:
Per informazioni su come caricare gli effetti in stile animazione, si prega di consultare quanto segue:
export const Spinkit = {
skChasingDots: 'sk-insegue-punti',
skCubeGrid: 'sk-cube-grilla',
skDoubleBounce: 'sk-doppio-rimbalzo',
skRotatingPlane: 'sk-rotationg-plano',
skSpinnerPulse: 'sk-spinner-pulse',
skThreeBounce: 'sk-tre-rimbalzo',
skWanderingCubes: 'sk-errante-cubi',
skWave: 'sk-wave'
};
|
Pubblicato su 10/06/2024 15:09:56
|
|
|
|
