javascript - inyeccion de dependencias angular

inyección de dependencia angular 6

Question

En la última versión de Angular 6, un servicio se registra en un módulo utilizando la propiedad providedIn en los metadatos del servicio:

@Injectable({
providedIn: ''root'',
})
export class HeroService {}

Sin embargo, la documentación también se refiere al registro del servicio en la matriz de providers módulos en los metadatos del módulo tal como lo hicimos en Angular 5:

@NgModule({
providers: [HeroService],
})
export class AppModule {}

Asi que,

• ¿Qué método se debe utilizar para que el inyector esté al tanto del servicio que debe inyectar?
• ¿El método de matriz de los providers módulos quedará en desuso?

Answer 1

Básicamente, puede usar cualquiera de los dos, pero según la nueva CLI, se provideIn automáticamente al crear el service

proporcionada en

Ahora hay una nueva forma recomendada de registrar un proveedor, directamente dentro del decorador @Injectable() , usando el nuevo atributo provisto. Acepta ''root'' como un valor o cualquier módulo de su aplicación. Cuando use ''root'' , su inyectable se registrará como un singleton en la aplicación, y no necesita agregarlo a los proveedores del módulo raíz. De forma similar, si utiliza el providedIn: UsersModule , el inyectable se registra como proveedor del UsersModule de UsersModule sin agregarlo a los proveedores del módulo.

Esta nueva forma ha sido introducida para tener una mejor sacudida de árboles en la aplicación. Actualmente, un servicio agregado a los proveedores de un módulo terminará en el paquete final, incluso si no se utiliza en la aplicación, lo cual es un poco triste.

Para obtener más información, consulte aquí

• https://blog.ninja-squad.com/2018/05/04/what-is-new-angular-6/
• angular.io/guide/…

Answer 2

Como siempre, cuando hay varias soluciones disponibles, depende de lo que desee lograr. Pero la documentación te da alguna directiva para elegir.

A veces no es conveniente que siempre se proporcione un servicio en el inyector raíz de la aplicación. Tal vez los usuarios deberían optar explícitamente por usar el servicio, o el servicio debería proporcionarse en un contexto cargado perezosamente. En este caso, el proveedor debe estar asociado con una @NgModule class específica de @NgModule class y será utilizado por cualquier inyector que incluya ese módulo.

Así que, básicamente, utilizará providedIn: ''root'' para cualquier servicio que abarque toda la aplicación. Para otros servicios seguir utilizando la versión antigua.

No olvide que en usted ya tuvo la opción de proporcionar un servicio diferente. Por ejemplo, también es posible declarar inyectable a nivel de componente (esto no cambia en V6).

 @Component({
selector: ''app-my-component'',
templateUrl: ''./my.component.html'',
providers: [ MyService ]
})

De esta manera, el servicio estará disponible solo en MyComponent y su árbol de subcomponentes.

Answer 3

Los @NgModule() y @Component() tienen la opción de metadatos de los proveedores, donde puede configurar proveedores para inyectores de nivel de NgModule o nivel de componente.

El decorador @Injectable () tiene la opción de metadatos provistos, donde puede especificar el proveedor de la clase de servicio decorada con el inyector raíz, o con el inyector para un NgModule específico.

En su caso, debido a que se ha proporcionado en el nivel "raíz", no es necesario agregar esto nuevamente como proveedor en el módulo.

Más sobre la inyección de dependencia aquí

Answer 4

Si está utilizando un desarrollador angular 5+, creará automáticamente el servicio inyectable cuando se declare como proporcionadoIn: ''root'', en este caso no tendrá que importar el servicio en app.module.ts. Puedes usarlo directamente en otro componente.