Service Issue - Not a Singleton?

[Scott L]

I am new to Angular 7 and running into an issue with Services that are supposed to be set-up as Singletons. I have two Services, ServiceA and ServiceB along with one component, ComponentA. So, ComponentA uses both services, A & B. ServiceB also has ServiceA injected into it. ComponentA calls a function on ServiceA at which point a variable is changed on ServiceA after data is returned. ComponentA then calls a function on ServiceB, at which point ServiceB tries to reference the previously changed variable on ServiceA. However, ServiceA is returning the initial value of the changed variable and not the new value. This leads me to believe that it's not actually a Singleton, but another instance of the service. I am registering the Services using:

@Injectable({
  providedIn: 'root'
})

Any idea what the issue may be here? There may be a better way to do this, but since I am new to Angular, this is the way I have it set-up for the time being. 

Thanks, in advance.

[Sander Elias]

Hi Scott,

Unless you provided the services elsewhere, they are singletons. I suspect that you are using primitives. As primitives are assigned by value and not by reference.

import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })

export class test1Service {

public someVar = '100';

constructor() {}

}

@Injectable({ providedIn: 'root' })

export class test2Service {

someRef = this.t.someVar;

constructor(private t: test1Service) {}

}

If you have something like that, the someRef will never updates, as it copies the value. A solution might be using a getter:

@Injectable({ providedIn: 'root' })

export class test2Service {

someRef = () => this.t.someVar;

constructor(private t: test1Service) {}

}

someRef is now a function that will return the current value.

Hope this helps,

Regards

Sander

[Scott]

Hi Sander, 

Thanks for the reply and assistance. Not sure that's exactly what is happening. I am actually using a getter/setter in ServiceA to set the (boolean) value and then in ServiceB I call the getter in ServiceA ... obviously after the value has been updated. I even put a timer on it just to ensure it was updated. If I console.dir(ServiceA) from ServiceB after the value was updated in ServiceA, it still shows the original value. You mention in your reply, "Unless you provided the services elsewhere", are you referring to listing them in the Providers array in a Module - as I am not doing that?

I can provide truncated version of the services and component if it would help. 

Thanks, 

Scott

--
You received this message because you are subscribed to a topic in the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/HmHBWjhux-o/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

[Sander Elias]

Scott, 

Yes, I was referring to the provider arrays in modules/services or components. 

If you can showcase your issue in a StackBlitz I can surely help you. 

When you can't get that to fly, truncated code here might help.

Regards

Sander

[Scott]

So, I created an example on StackBlitz and of course it's working on the site - check out console.log(). Any ideas what could be breaking it in my App?

[Scott]

So, I was able to resolve the issue by deleting the service and the just re-creating it with the same name as the previous service. Not really sure what happened, but decided to try it as any additional services I was adding were Singletons and would display the correct boolean value.

Thanks for the assistance.

[Tito]

are you doing any sort of aching?