tutorial providers example decorators javascript angularjs decorator angularjs-decorator

javascript - providers - inject value angularjs



¿Qué son los "decoradores" y cómo se usan? (5)

Tengo curiosidad de qué son exactamente los decoradores en AngularJS. No hay mucha información en línea para los decoradores excepto una propaganda en la documentación de AngularJS y una breve (aunque interesante) mención en un video de youtube .

Como dicen los chicos de Angular, un decorador es:

La decoración del servicio permite al decorador interceptar la creación de la instancia de servicio. La instancia devuelta puede ser la instancia original o una nueva instancia que delega a la instancia original.

Realmente no sé lo que eso significa , y no estoy seguro de por qué separarías esta lógica del servicio en sí. Por ejemplo, si quisiera devolver algo diferente bajo diferentes condiciones, simplemente pasaría diferentes argumentos a las funciones relevantes o usaría otra función que compartiera ese estado privado.

Todavía soy un novato de AngularJS, así que estoy seguro de que es solo ignorancia y / o malos hábitos que he recogido.


En palabras simples, podemos decir que es como un método de extensión. Por Ej. Tenemos una clase y tiene dos métodos y en el tiempo de ejecución queremos agregar más método, luego usamos Decorator.

No podemos usar $ provide.decorator con constantes porque no podemos cambiar las constantes que están agotando la propiedad de solo lectura.


En resumen, los decoradores se pueden describir de la siguiente manera:

Una función de decorador intercepta la creación de un servicio, lo que le permite anular o modificar el comportamiento del servicio.

Utiliza el servicio $provide por angular y modifica o reemplaza la implementación de otro servicio

$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; }]);

Ejemplo:

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

Aplicaciones

Además de la respuesta de @JBland.

  • Configuración de configuración regional amplia de la aplicación:

    Puedes encontrar un ejemplo here

  • Comportamiento por defecto de Changiging y la implementación existente de un servicio por servicio angular: -

    Puedes encontrar un ejemplo here

  • Conmutación del comportamiento de una función en diferentes entornos.


Los decoradores nos permiten separar las preocupaciones transversales y permitir que los servicios preserven el principio de responsabilidad única sin preocuparse por el código de "infraestructura".

Usos prácticos de decoradores:

  • Almacenamiento en caché: si tenemos un servicio que realiza llamadas HTTP potencialmente costosas, podemos envolver el servicio en un decorador de caché que verifica el almacenamiento local antes de realizar la llamada externa.
  • Depuración / seguimiento: cambie de acuerdo con su configuración de desarrollo / producción, que decora sus servicios con depuradores o contenedores de rastreo.
  • Estrangulamiento: envuelve las llamadas que se activan con frecuencia en una envoltura antirrebote. Nos permite interactuar fácilmente con servicios de tarifa limitada, por ejemplo.

En todos estos casos, limitamos el código en el servicio a su principal responsabilidad.


decorator puede interceptar una instancia de servicio creada por factory, service, value, provider , y le da las opciones para cambiar alguna instance(service) que de otro modo no es configurable / con opciones.

También puede proporcionar instancias de prueba para fines de prueba, por ejemplo $http .


Un buen caso de uso de $provide.decorator es cuando necesita realizar un "ajuste" menor en un servicio de terceros / ascendente, del cual depende su módulo, mientras deja el servicio intacto (porque usted no es el propietario / mantenedor del Servicio). Here hay una demostración en Plunkr.