1

Imagine the following situation. Component A updates an array A in Service A. Component B uses/reads array A in Service A. If I want to Component B to be notified...when component A updates the Array, I could use a singleton, but my feeling...(coming from a C# + MVVM background) a singleton service would be overkill as this is only used by those 2 components in the application.

Is there an alternative, or should I just go ahead and create a singleton service?

Any advice is appreciated,

Thank you,

3 Answers 3

2

No, it's not overkill at all, and would seem a perfectly idiomatic solution.

Angular2 services are (often) singletons.

It's my understanding that if you:

  • Decorate your Service with @Injectable
  • Add your Service to providers[] in @NgModule,
  • import your service into your Components

you should share the same, single instance of that Service.

You can, if you choose, declare the Service as a provider to a component by including it in the @Component decorator's provider[] list, which will instantiate a new instance of the Service for the component. This is useful if you wish to provide functionality without sharing state.

Here is an informative and jovial write-up on this behaviour: https://blog.budacode.com/2016/06/02/angular-2-services/

Sign up to request clarification or add additional context in comments.

9 Comments

Its not always true that services are singleton only. It depends how you declare them.
FYI...the way you declare service demonstrates older way of declaring service (probably in beta version of Angular2)
I guess what @micronyks means is, where you provide a service defines the scope of the service. Angular2 DI maintains a single instance (singleton) per provider. If you want two components to share a service instance and the components are parent and child you can provide the service at the parent and only the parent and it's children can inject this service (limiting the scope). If the components that are supposed to communicate are not parent-child then you can choose some other common parent to provide the service at.
If you provide a service at a component a provider is created for each component instance. To have an application-wide singleton provide the service in @NgModule(). Even if multiple modules provide the same service, only one provider is actually created for the whole application. Lazy loaded modules have their own root scope.
@GünterZöchbauer describes exactly what I wanted to convey.
|
2

If an array is updated in ServiceA by ComponentA and omponentB uses/reads that updated array from serviceA only, you must use singleton service only so that ComponentA and ComponentB will use/share single instance of ServiceA.

So any update made by componentA to SeviceA will also be available in ComponentB because of single instance.

Comments

1

Going with a Service would be the "standard" Angular approach to this, and as msanford pointed out, that´s completely fine. Since ng2 is quite flexible, you also could take other ways like using a redux implementation (like https://github.com/ngrx/store).

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.