Перезагрузить текущую страницу в Ionic 4, angular 7 - PullRequest
2 голосов
/ 10 апреля 2019

Я пытаюсь создать запасной вариант для тех, кто работает приложение без подключения к Интернету. В mypage.ts у меня есть следующее:

import { Component, OnInit } from '@angular/core';
import { Network } from '@ionic-native/network/ngx';
@Component({
  selector: 'app-contacto',
  templateUrl: './contacto.page.html',
  styleUrls: ['./contacto.page.scss'],
})
export class ContactoPage implements OnInit {
  constructor(private network: Network) {
        // watch network for a connection
        this.network.onConnect().subscribe(() => {
          document.getElementById("netOFF").style.display="none";
         // document.getElementById("netRel").style.display="none";
          console.log('Internet ON');
        });
         // watch network for a disconnection
         this.network.onDisconnect().subscribe(() => {
          document.getElementById("netON").style.display="none";
          console.log('Sin conexión a Internet');
        });
        function reload() {
          this.ionViewWillEnter();
      }
      }
  ngOnInit() { }
}

Мой HTML-файл выглядит так:

<ion-content>
    <div id="netON">
        <iframe src="https://www.domain.es/" style="top:57px; left:0; bottom:0; right:0; width:100%; height:100%; border:none; margin:0; padding: 0; overflow:hidden; z-index:999999;"></iframe>
      </div>
<div id="netOFF"><ion-img src="/assets/img/net.png" style="display:block; width:100%; height:100%; object-fit: cover; z-index:999999;"></ion-img>
</div>
  </ion-content>
  <ion-footer id="netRel" (click)="reload()">
      <ion-toolbar color="danger">
          <ion-icon name="exit" slot="start"></ion-icon>
        <ion-title>Reintentar</ion-title>
      </ion-toolbar>
    </ion-footer>

Таким образом, контактная форма является iframe, если у телефона нет подключения к Интернету, netON (iFrame) будет скрыта, если у телефона есть подключение к Интернету, Iframe будет быть показано.

Кроме того, у меня есть кнопка (click) = "reload ()" , для тех, у кого нет подключения и они снова в сети, чтобы перезагрузить страницу.

Мне нужен способ перезагрузить страницу при щелчке пользователя для Ionic 4.

Обратите внимание, что я сделал некоторые изменения, чтобы проверить кнопку действие при нажатии, чтобы я сделал его видимым, но он скрыт, если нет Интернета, и картинка тоже.

1 Ответ

1 голос
/ 01 июля 2019

ваш код не показывает, какие данные вы действительно загружаете при вызове метода reload ().** Примечание: ваша функция reload () не должна быть в вашем конструкторе.Он должен быть вне конструктора на том же уровне, что и ngOnInit () {} **

Так что, если есть данные, которые нужно извлечь, любезно вызывайте функции / методы внутри метода reload (), чтобы-выбрать и обновить вид:

reload() {
    this.getData();
}

// where getData() method is what does the actually loading of the data like:

getData() {
    this.apiService.fetchData()
    .subscribe(
        data => {
            this.items = data;
    }, err => {});
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...