Cosa sono i "decoratori" e come vengono utilizzati?


148

Sono curioso di sapere cosa siano esattamente i decoratori in AngularJS. Non ci sono molte informazioni online per i decoratori, a parte uno sballo nella documentazione di AngularJS e una breve (sebbene interessante) menzione in un video di YouTube .

Come dicono i ragazzi di Angular, un decoratore è:

Decorazione del servizio, consente al decoratore di intercettare la creazione dell'istanza del servizio. L'istanza restituita può essere l'istanza originale o una nuova istanza che delega all'istanza originale.

Non so davvero cosa significhi , e non sono sicuro del motivo per cui dovresti separare questa logica dal servizio stesso. Ad esempio, se volessi restituire qualcosa di diverso in condizioni diverse, passerei semplicemente argomenti diversi alle funzioni pertinenti o utilizzerei un'altra funzione che condivide quello stato privato.

Sono ancora un po 'un angolo di AngularJS, quindi sono sicuro che sono solo l'ignoranza e / o le cattive abitudini che ho preso.

Risposte:


219

Un buon caso di utilizzo $provide.decoratorè quando è necessario eseguire piccoli "ritocchi" su alcuni servizi di terze parti / upstream, dai quali dipende il modulo, lasciando intatto il servizio (perché non si è il proprietario / manutentore del servizio). Ecco una dimostrazione su plunkr.


6
Fantastico esempio In realtà mi chiedevo come estendere la funzionalità dei moduli di terze parti senza interferire con loro
Arthur Kovacs,

5
I decoratori in realtà ducktype tutte le istanze di un servizio o sono mirati al solo modulo che le decora? In altre parole, supponiamo di avere il modulo A che decora un servizio dal modulo B. Poi ho il modulo C che dipende dal modulo A e dal modulo B. All'interno del modulo C, il servizio del modulo B è la versione originale o decorata?
Jon Jaques,

3
@JonJaques - Questa è un'ottima domanda. Non mi sono imbattuto in una simile situazione. Se dovessi indovinare, la versione del servizio che vede il modulo C dovrebbe essere quella decorata dal modulo A ma non posso dirlo con certezza fino a quando non lo proverò io stesso. Perché non scrivi un semplice plunkr / jsffidle e sperimentalo. Sarebbe fantastico se potessi condividere le tue scoperte con noi. Saluti.
Tamakisquare,

6
@JonJaques - Impossibile trattenere la mia curiosità, quindi ho aggiunto alcune righe al mio esempio originale per trovare la risposta alla tua domanda, link . In breve, l'ipotesi nel mio commento precedente è giusta.
Tamakisquare,

17
Le fabbriche, i servizi, ecc. Sono singoli (così come sono forniti), quindi una volta decorati, sempre decorati.
FlavorScape

66

I decoratori ci consentono di separare le preoccupazioni trasversali e consentono ai servizi di preservare il principio della responsabilità singola senza preoccuparsi del codice "infrastruttura".

Usi pratici dei decoratori:

  • Caching: se disponiamo di un servizio che effettua chiamate HTTP potenzialmente costose, possiamo racchiudere il servizio in un decoratore di cache che controlla l'archiviazione locale prima di effettuare la chiamata esterna.
  • Debugging / Tracing: imposta un interruttore a seconda della configurazione di sviluppo / produzione che decora i tuoi servizi con wrapper di debug o traccia.
  • Limitazione: avvolge le chiamate attivate frequentemente in un wrapper di debouncing. Ad esempio, ci consente di interagire facilmente con servizi a tariffa ridotta.

In tutti questi casi, limitiamo il codice nel servizio alla sua principale responsabilità.


10

decoratorpuò intercettare l'istanza del servizio creata da factory, service, value, providere offre le opzioni per modificarne alcune instance(service)che altrimenti non sono configurabili / con opzioni.

Può anche fornire istanze di simulazione a scopo di test, ad esempio $http.


1
Vale la pena notare che è anche possibile ignorare le directivedefinizioni presentate da Ben Nadel
David Salamon il

Ecco il riferimento nei documenti angolari ufficiali: https://docs.angularjs.org/guide/decorators
David Salamon,

3

In parole semplici possiamo dire che è come un metodo di estensione. Per es. Abbiamo una classe e ha due metodi e in fase di esecuzione vogliamo aggiungere più metodo in esso quindi usiamo Decorator.

Non possiamo usare $ fornire.decorator con costanti perché non possiamo cambiare le costanti che stanno possedendo proprietà di sola lettura.


1

In breve, i decoratori possono essere descritti come segue: -

Una funzione di decorazione intercetta la creazione di un servizio, consentendogli di ignorare o modificare il comportamento del servizio.

Utilizza il $provideservizio in modalità angolare e modifica o sostituisce l'implementazione di un altro servizio

$provide.decorator('service to decorate',['$delegate', function($delegate) {
  // $delegate - The original service instance, 
  //             which can be replaced, monkey patched, 
  //             configured, decorated or delegated to. 
  //             ie here what is there in the 'service to decorate'

  //   This function will be invoked, 
  //   when the service needs to be provided 
  //   and should return the decorated service instance.
  return $delegate;
}]);

Esempio:

$provide.decorator('$log', ['$delegate', function($delegate) {
  // This will change implementation of log.war to log.error
  $delegate.warn = $delegate.error; 
  return $delegate;
}]);

applicazioni

Oltre alla risposta @JBland.

  • Impostazioni internazionali a livello di applicazione: -

    Puoi trovare un esempio qui

  • Modifica del comportamento predefinito e dell'attuazione esistente di un servizio per servizio angolare: -

    Puoi trovare un eample qui

  • Cambio del comportamento di una funzione in ambienti diversi.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.