typescript - El constructor en la clase MyApp llama al proveedor solo una vez

Necesito llamar en cada una de las páginas, el estado de la conexión del wifi. Luego usar un proveedor, pero en el constructor de MyApp(app.component.ts), llamar al proveedor(ConectivityServiceProvider) solo una vez.

app.component.ts

import { ConectivityServiceProvider } from '...'
import { Network } from '.....';
export class MyApp {
  conectivity:boolean
  constructor(private provider: ConectivityServiceProvider,public network: Network){
     platform.ready().then(() => {
       this.conectivity=provider.isOnline();
       // call once in all pages
       if(this.conectivity){
          //do someting
       }else //do something
     }
  }
}

Proveedor :

@Injectable()
export class ConectivityServiceProvider {
statusConectivity: boolean =true;
constructor(public network: Network){
     this.network.onDisconnect().subscribe(() => {
        this.statusConectivity=false;
      });
}
isOnline(){
    return this.statusConectivity;
  }
}

Si pongo todo dentro del proveedor en la clase MyApp, se llama en cada una de las páginas y no solo una vez. ¿Por qué al usar el proveedor solo se llama una vez?

Respuesta #1

Deberías revisar los eventos del ciclo de vida de Ionic

Por tu descripción, parece que tienes 3 opciones:

• ionViewDidLoad - void Se ejecuta cuando la página se ha cargado. Este evento solo ocurre una vez por cada página que se crea. Si una página se abandona pero se mantiene en caché, entonces este evento no se disparará nuevamente en una visualización posterior. El evento ionViewDidLoad es un buen lugar para colocar tu código de configuración para la página.
• ionViewWillEnter - void Se ejecuta cuando la página está a punto de entrar y convertirse en la página activa.
• ionViewDidEnter - void Se ejecuta cuando la página ha entrado completamente y ahora es la página activa. Este evento se disparará, ya sea que sea la primera carga o una página en caché.

Así que dependiendo de cuál sea tu enfoque para el caso cuando pierdes la conexión, podrías usar ionViewDidLoad para verificar en cada carga inicial de la página o ionViewWillEnter para comprobarlo antes de cada vez que se muestre la página (eso incluye, por ejemplo, operaciones de retroceso).

El código en app.component.ts se vería así:

import { ConectivityServiceProvider } from '...'
import { Network } from '.....';

export class MyApp
{
    conectivity: boolean;

    constructor(private provider: ConectivityServiceProvider, public network: Network)
    {
        platform.ready().then(() =>
        {
        });
    }

    ionViewDidLoad()
    {
        this.conectivity = provider.isOnline();
        // call once in all pages
        if(this.conectivity)
        {
            //do someting
        }
        else //do something
        {
        }
    }

}

Respuesta #2

Por favor, prueba el HttpInterceptor de Angular

Un interceptor intercepta cada una de las llamadas API en la aplicación. Así que antes de cada llamada API podemos verificar el estado de la conexión y manejar el código en consecuencia.

Referencia: Capturar solicitudes globalmente en Angular 4 y detenerse si no hay internet

import { Injectable } from '@angular/core';
import {
    HttpRequest,
    HttpHandler,
    HttpEvent,
    HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class ConectivityServiceProvider implements HttpInterceptor {
    constructor() { }

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        // check to see if there's internet
        if (!window.navigator.onLine) {
            // if there is no internet, throw a HttpErrorResponse error
            // since an error is thrown, the function will terminate here
            return Observable.throw(new HttpErrorResponse({ error: 'Internet is required.' }));

        } else {
            // else return the normal request
            return next.handle(request);
        }
    }
}