Búsqueda de sitios web

javascript - Evitar múltiples instancias de un servicio en Angular

He hecho algo de investigación en la red, y he descubierto que el problema que estoy enfrentando es que se están creando múltiples instancias del servicio, y quiero evitar eso. ¿Alguien puede por favor mirar mi código y señalar el cambio que necesito hacer?

Segundo servicio que utiliza el servicio primario que está siendo duplicado.

export class SecondaryService {
    constructor(private primarySvc: IPrimaryService){
        this.primarySvc.someSubject.subscribe(() => {});
    }
}

Servicio Primario (el que se está duplicando)

export class PrimaryService {
    someSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
    constructor(){}
}

Proveedor de servicios principal

@Injectable()
export class PrimaryServiceProvider extends PrimaryService {
     constructor(){
          super();
     }
}

Proveedor de servicios secundario

@Injectable()
export class SecondaryServiceProvider extends SecondaryService {
    constructor(private PrimaryProvider: PrimaryServiceProvider){
        super(PrimaryProvider);
    }
}

app.module.ts

 @NgModule({
     declaration: [SecondaryComponent],
     exports: [SecondaryComponent],
     imports: [BrowserModule],
     providers: [SecondaryServiceProvider, PrimaryServiceProvider ]
 })
 export class SearchModule{}

Ahora estoy intentando usar el componente que hice en un entorno local, que se ve algo así:

app.module.ts

 @NgModule({
     declaration: [AppComponent, HomeComponent],
     imports: [SearchModule, BrowserModule],
     providers: [PrimaryServiceProvider, SecondaryServiceProvider],
     bootstrap: [AppComponent]
 })
 export class AppModule{}

home.component.ts

export class HomeComponent {
    constructor( primarySvc: PrimaryServiceProvider, 
        secondarySvc: SecondaryServiceProvider) {
        this.primarySvc.someSubject.next(false);
    }
}

Ahora sé con certeza que el Servicio Primario tiene dos instancias ya que someSubject no está sincronizado, y la suscripción en SecondarySvc no está obteniendo ningún valor de home.component.ts

Por favor dime dónde necesito hacer los cambios

¡Gracias!!

Respuesta #1

Respondiendo a mi propia pregunta:

Los servicios se duplicaron debido a una ruta de archivo incorrecta al importar. Windows permite usar rutas de archivo que no distinguen entre mayúsculas y minúsculas, lo que puede crear múltiples instancias cada vez que se utiliza el módulo.

Respuesta #2

Creo que estás sobreingenierizando al usar los servicios PrimaryServiceProvider y SecondaryServiceProvider.

Para crear un servicio singleton, solo configura la opción providedIn: 'root' en el decorador Injectable, así:

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

Por último, asegúrate de no registrar un servicio singleton en ningún providers array.

Consulta la documentación oficial sobre esto aquí.

Artículos relacionados