Перезагрузите страницу при отправке новых данных Ionic 4 - PullRequest
Новая
       27

Перезагрузите страницу при отправке новых данных Ionic 4

0 голосов
/ 01 июля 2019

У меня есть страница, которая отображает список пользователей в моем приложении. Тем не менее, на странице есть всплывающее окно, которое получает расстояние от пользователя и пытается изменить список в зависимости от расстояния. Проблема в том, что после выбора нового расстояния ничего не происходит. Как я могу перезагрузить эту страницу с новыми данными. Вызов API работает нормально, так как я вижу console.log нового объекта с новыми пользователями.

changeLocationComponent (поповер) 

   changeLoc() {
        console.log('Get slider value');
        console.log(this.distance);
        this.viewService.viewPatient1(this.distance).subscribe((res: any) => {
          console.log('Distance', this.distance);
          if (!res) {
            console.log('No Patients');
          } else {
          console.log('Result');
          console.log(res.patients.data);
          this.patients = res.patients.data;
          // this.router.navigate(['view-patient']);
          this.navCtrl.navigateForward('/view-patient');
        //  this.ref.detectChanges();
        }
        });

пациенты-page.ts 

ngOnInit() {
  }

  ionViewWillEnter() {
    this.viewPatients();
  }

  viewPatients() {
  this.viewService.viewPatient().subscribe((res: any) => {
    if (!res) {
      console.log('No Patients');
    } else {
    this.patients = res.patients.data;
  }
  });
  }

  async notifications(ev: any) {
    const popover = await this.popoverCtrl.create({
        component: NotificationsComponent,
        event: ev,
        animated: true,
        showBackdrop: true,
        cssClass: 'pop-over-style',
    });
    return await popover.present();
}

1 Ответ

2 голосов
/ 01 июля 2019

Вам нужно dismiss всплывающее окно, чтобы отправить данные, которые изменены.Вы возвращаете данные о пациентах из вашего http-вызова в viewService.Тогда вам нужно передать эти данные обратно на исходную страницу. 

changeLoc() {
  // your code here or create a button to close the popover
 this.popoverController.dismiss(this.patients);
}

На странице пациентов вам необходимо собрать данные, которые вы только что отклонили.Вы получите OverlayEventDetail в ответ от Popover.Это определено в документации здесь: https://beta.ionicframework.com/docs/api/popover. Ваши отправленные данные хранятся в возвращенной переменной patients, которая имеет объект data (вы можете console.log () увидеть его самостоятельно).Затем присвойте эту информацию своей переменной на странице. 

async notifications(ev: any) {
  const popover = await this.popoverCtrl.create({
      component: NotificationsComponent,
      event: ev,
      animated: true,
      showBackdrop: true,
      cssClass: 'pop-over-style',
  });
  popover.onDidDismiss().then(patients => {
    if (patients) {
      this.patients = patients.data
    }
  });
  return await popover.present();
}
...