What is the difference between useValue
and useFactory
providers?
It seems useFactory
returns a value and useClass
also does the same.
To summarize, choose useValue to provide the same injected value each time*, useFactory when the injection value should be computed at runtime, and useClass when you want the injector to construct a value of Type<any> to provide.
Factory Provider: useFactoryIt invokes the function and injects the returned value. We can also add optional arguments to the factory function using the deps array. The deps array specifies how to inject the arguments. We usually use the useFactory when we want to return an object based on a certain condition.
useClass - this option tells Angular DI to instantiate a provided class when a dependency is injected. useExisting - allows you to alias a token and reference any existing one.
The useExisting provider key lets you map one token to another. In effect, the first token is an alias for the service associated with the second token, creating two ways to access the same service object.
useFactory
takes a factory function that is expected to return the value and also can have dependencies (require instances of other providers passed as parameter)See for example the config:ConfigService
parameter required by the factory function in How to pass parameters rendered from backend to angular2 bootstrap method
useValue
is just the value that is injected as is
useClass
expects a type name and Angular creates an instance from the passed type and also resolves and passes constructor parameters to the class if there are any
There is also useExisting
which is like an alias for an already registered provider. The use case is to provide the same instance of a provider with different keys.
See Angular 2 useExisting providers for an example.
useValue:
will assign current whatever assigned object instance which you provided.
useFactory
: It also does the same, You can configure a factory object based on other dependency inside function
and before returning an instance of it.
{ provide: CustomDependency, useFactory: () => { if (IS_A) { return new A(); } else { return new B(); } } }
You can use
useFactory
to configure your dependency at configuration time. Its same as that ofconfig
phase Angular 1, where you are modifying or forming a dependency as you needed.
My basic understanding...
You can think is useValue
roughly as static assignment; the Provider adheres to the ValueProvider interface:
Given that you always want the value '12345'
when using @Inject(INJECTION_TOKEN)
, then this will work,
providers: [
{
provide: INJECTION_TOKEN,
useValue: '12345',
},
],
This will always return '1234' when using @Inject(INJECTION_TOKEN)
.
Whereas,
providers: [
{
provide: INJECTION_TOKEN,
useValue: () => '12345',
},
],
Will provide a function for INJECTION_TOKEN
that will return '12345'.
useFactory
expects a function to produce the injected value. The return value of the factory function is what is injected. This, useFactory
provider type uses FactoryProvider interface. An optional array of deps
can be added that allows for arguments to be passed to the factory function.
Finally, useClass
,
Configures the Injector to return an instance of useClass for a token. [1]
The injector will provide an instance of the provided class. Noteworthy, the injector will also provide the injected dependencies of the Type<any>
, the value type of field, useClass
on the ClassProvider
[1] interface.
To summarize, choose useValue
to provide the same injected value each time*, useFactory
when the injection value should be computed at runtime, and useClass
when you want the injector to construct a value of Type<any>
to provide.
* Note: The value provided to useValue
can be a function so can produce dynamic values if the injected value is invoked, because it is a function.
[1] ClassProvider
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With