1

en el caso de tener algún servicio como:

    @Injectable()
export class datoService {

    public Obs: Observable;

    //Propiedades para la Opcion2
    public datos:any; 
    private Subs: Subscription;    
    private rfs = (datos:any)=>{
        this.datos = datos;
    };

    constructor() {
        //crear el observable de alguna cosa
        this.Obs = of("...de algo");
    }

    //Metodos para la Opcion2        
    public getDatos():any{
        return this.datos;
    }

    public activarSubs():void{
        this.Subs = this.Obs.subscribe(this.rfs);
    }

    public destruir():void{
        this.Subs.unsubscribe();
    }
}

Como se ve tiene incorporado un observable Obs como propiedad. pongo como ejemplo las siguientes opciones para inyectar el servicio:

Opción 1

    //una clase o servicio o Componente 
//que quiera inyectar  algunService
export class MiClase {

    private datoSubs:Subscription;

    private rfs = (datos:any) => {
        //.. hacer algo con los datos...
    }

    constructor(private _dS:datoService) {}

    public leerDatos():void{
        this.datoSubs = this._dS.Obs.subscribe(this.rfs);
    }

    public unsDato():void{
        this.datoSubs.unsubscribe();
    }
}

Opción 2

    //una clase o servicio o Componente 
//que quiera inyectar  datoService
export class MiClase {

    public datos:any;

    constructor(private _dS:datoService){
        this._dS.activarSubs();
    }

    public leerDatos():void{
        this.datos = this._dS.getDatos();
    }

    public unsDato():void{
        this._dS.destruir();
    }
}

En la Opcion1 para obtener los datos monitoreados por el Obs del servicio, debo estar administrando todo lo referente a la suscripción, desuscripcion y a la función rfs y en varia documentación que leo, indican que toda la lógica debe estar en el servicio que provee dichos datos .

En la Opcion 2 intento agrupar toda la lógica del monitoreo de datos en el servicio pero tengo el problema que para obtener, cada vez, los datos actuales debo estar llamando el método leerDatos()

¿Cuál es la más adecuada o si hay otras opciones?

2
  • La pregunta va enfocada a mejores practicas, cual de las opciones de es mejor implementar o si existe una opción mejor. Commented el 1 mar. 2020 a las 22:21
  • No entiendo, como debe quedar entonce la pregunta: "mejores practicas para colocar la lógica de un observable" pero entonces no seria una pregunta Commented el 1 mar. 2020 a las 22:27

1 respuesta 1

1

Por lo general un servicio solo debería retornar Observables y el componente consumir el Observable haciendo el subscribe y el unsubscribe, pero todo depende del contexto donde se aplique.

A grandes rasgos yo identifico dos escenarios donde es mejor una u otra forma, cabe aclarar que es desde la perspectiva de tener una aplicación que use una base de datos en tiempo real.

Escenario 1: Usar el componente

Si la información a consultar solo la necesitas en el periodo de vida de un componente especifico, es decir una vez que se destruya ese componente esa información deja de ser util y teniendo en cuenta que es real time solo te generara costos adicionales.

Como dato adicional el unsubscribe de un Observable lo puedes hacer de multiples maneras .unsubscribe(), | async , takeUntil y más, puedes investigar sobre el tema, hay varias publicaciones respecto a esto.

Escenario 2: Usar el servicio

Cuando no deseas estar consultando la información al servidor cada vez que entras a un componente porque es información que no cambia frecuentemente o es una información que se necesitara a lo largo de toda la aplicación.

Una forma seria con Subjects, aquí el servicio tiene métodos como en tu ejemplo para activar y destruir la suscripción, igual se podrían quitar estos métodos y hacer uso del ngOnInit y el ngOnDestroy dependiendo del uso que se le dé.

@Injectable()
export class DatosService {

    private datos: ReplaySubject<Dato>;
    private subscripcion: Subscription;

    constructor() {
        this.datos = new ReplaySubject<Dato>(1);
    }

    subscripcionActiva(): boolean {
        return !!(this.subscripcion && !this.subscripcion.closed);
    }

    activarSubscripcion() {
        if (!this.subscripcionActiva()) {
            this.subscripcion = of("...de algo")
                .subscribe(resultado => {
                    this.datos.next(resultado);
                });
        }
    }

    destruirSubscripcion() {
        this.subscripcion && this.subscripcion.unsubscribe();
    }

    getDatos(): Observable<Dato> {
        return this.datos.asObservable();
    }
}

Otra forma de implementar esto seria con shareReplay, esto es para guardar el resultado de la ultima consulta y cada vez que se ejecute el método getDatos no volver a consultar dé nuevo directo al servidor.

@Injectable()
export class DatosService {

    private datos: Observable<Dato>;

    constructor() {
        this.datos = of("...de algo")
            .pipe(
                shareReplay(1)
            );
    }

    getDatos(): Observable<Dato> {
        return this.datos;
    }
}

Esta forma es muy util ya que se activa cuando se empieza a consumir la información, pero también se debe de ser cuidadoso que el observable correspondiente a esta parte of("...de algo") no falle, para ello se puede usar el catchError. Y pues sí, cómo se puede notar la suscripción en este caso se haría en el componente no en el servicio, así que en este escenario se podría administrar la suscripción en donde te resulte más practico, como en casi todos los escenarios. Al final solo son ideas de casos de uso.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.