List does not update

tutorials
1

Good morning, I’m starting my ionic journey and I have the following scenario:
I created an app, a simple CRUD, where you have a list of items and a modal to register a new item, when I close the modal clicking save the new item is sent to my API, saved in the database and returned to the list. This works fine in the ionic serve but when I squeeze in the device the item just saves in the bank but does not return to list. My Class Functions:

 getDados() {
  //retorno de Dados
   this.service.getData()
    this.service.getData()
      .then((lancamentos: Array<any>) => {
        this.lancamentos = lancamentos;
      }, (error) => {
        console.log('Erro ao listar ',error);
      })
  }

  postDados(lancamento) {
    this.service.postData(lancamento.value)
      .then((data) => {
        if(data) {
          console.log(data),
          this.close();  
          this.presentToast();
        }
      }, (error) => {
          console.log('Erro ao cadastrar. ', error);
          this.presentToastErro();
      }
    );
  }

minhas funções provider para API:

  getData() {
        return new Promise((resolve, reject) => {
              this.http.get(this.api + 'apiRecupera.php')
              .map(res => res.json())
              .subscribe(data => {
                    resolve(data);
              }, error => {
                    reject(error);
              });
        });
        
  }

  postData(parans) {
        let headers = new Headers({ 'Content-Type' : 'application/x-www-form-urlencoded' });

        return new Promise((resolve, reject) => {
              this.http.post(this.api + "apiCadastroCont.php", JSON.stringify(parans), {
              headers:headers,
              method:"POST"
        })
        .map(res => res.json())
        .subscribe(data => {
              resolve(data);
        }, error => {
              reject(error);
        })
    });     
  }`Preformatted text`
2

Since I can see your component class it is difficult for me to troubleshot what is going on. I Suggest you use the chrome/safari remote debugger to look what is going wrong. here you can see how to do that.

3

Thanks for the reply, the big problem is that it does not present me any errors in the debugger, in console me diz the message that the operation in the database worked out (really works) just does not update the list of items. Just refresh if I go into the app settings and clear the data.

My service:

import { Injectable } from '@angular/core';
import { Http, Headers, Response, ResponseOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';


@Injectable()
export class ServiceProvider {

      api : string = 'myUrl';

  constructor(public http: Http) {}

  
      getData() {
            return new Promise((resolve, reject) => {
                  this.http.get(this.api + 'apiRecupera.php')
                  .map(res => res.json())
                  .subscribe(data => {
                        resolve(data);
                  }, error => {
                        reject(error);
                  });
            });
            
      }

      postData(parans) {
            let headers = new Headers({ 'Content-Type' : 'application/x-www-form-urlencoded' });

            return new Promise((resolve, reject) => {
                  this.http.post(this.api + "apiCadastroCont.php", JSON.stringify(parans), {
                  headers:headers,
                  method:"POST"
            })
            .map(res => res.json())
            .subscribe(data => {
                  resolve(data);
            }, error => {
                  reject(error);
            })
        });     
      }

      deleteData(id) {
            let headers = new Headers({ 'Content-Type' : 'application/x-www-form-urlencoded' });

            return new Promise((resolve, reject) => {
                  this.http.patch(this.api + "apiDeleta.php", id, {
                  headers:headers,
                  method: "PATCH"
             })
                  .map(res => res.json())
                  .subscribe(data => {
                        resolve(data);
                  }, error => {
                        reject(error);
                  });
            });
      }
      
      updateData(data) {
            let headers = new Headers({ 'Content-Type' : 'application/x-www-form-urlencoded' });

            return new Promise((resolve, reject) => {
                  this.http.post(this.api + "apiUpdate.php", data, {
                  headers:headers,
                  method:"POST"
            })
                  .map(res => res.json())
                  .subscribe(data => {
                        resolve(data);
                  }, error => {
                        reject(error);
                  });
            });
      }

}

My component:

import { Component, OnInit } from '@angular/core';
import { NavController, NavParams, ViewController, ToastController } from 'ionic-angular';
import { Camera } from 'ionic-native';
import { NgForm } from '@angular/forms';
import { ServiceProvider } from '../../providers/service-provider';


@Component({
  selector: 'page-modal-lancamentos',
  templateUrl: 'modal-lancamentos.html'
})
export class ModalLancamentosPage implements OnInit {

  lancamentos: any;
  image: any;

  constructor(public navCtrl: NavController, public service : ServiceProvider, 
              public navParams: NavParams, public view: ViewController,
              public toastCtrl: ToastController ) {

                this.lancamentos = {};
              }


  presentToast() {
    let toast = this.toastCtrl.create({
      message: 'Lançamento salvo!',
      duration: 2000
    });
    toast.present();
  }

  presentToastErro() {
    let toast = this.toastCtrl.create({
      message: 'Erro ao enviar lançamento, tente mais tarde!',
      duration: 2000
    });
    toast.present();
  }


  getDados() {
  //retorno de Dados
   this.service.getData()
    this.service.getData()
      .then((lancamentos: Array<any>) => {
        this.lancamentos = lancamentos;
      }, (error) => {
        console.log('Erro ao listar ',error);
      })
  }

  postDados(lancamento) {
    this.service.postData(lancamento.value)
      .then((data) => {
        if(data) {
          console.log(data),
          this.close();  
          this.presentToast();
        }
      }, (error) => {
          console.log('Erro ao cadastrar. ', error);
          this.presentToastErro();
      }
    );
  }

  ngOnInit() {

  }

  close() {
    this.view.dismiss(this.lancamentos);
  }

  takeComprovante() {

    Camera.getPicture({
      allowEdit: true
    }).then((imageData) => {
          let base64Image = 'data:image/jpeg;base64,' + imageData;
          this.image = base64Image;
      }, (err) => {
        console.log(err);
    });

  }

}
4

for what I’ve understood, you have a page that open a modal to created a new object (lancamentos).
after the form complete you call the WS postDados() . and then you dismiss the modal by passing the data (response of the post).

What I think in other to update you list after the modal closed, you need to call the onDismiss method of your modal in the list page class

 ModalLancamentosPage.onDidDismiss(data => {
         console.log(data);
          // do some stuff whit data 
   });
5

I suggest you read this to

6

Sorry it does not appear in the code, but I already do it this way:

presentModalLancar(){
    let modalLancar = this.modalCtrl.create(ModalLancamentosPage);

    modalLancar.onDidDismiss(() => {
        this.getDados();
    }); 

    modalLancar.present();
  }

Even without success

7 
presentModalLancar(){
    let modalLancar = this.modalCtrl.create(ModalLancamentosPage);

    modalLancar.onDidDismiss((data) => {
        // try to see if this part is realy run ...
        this.getDados();
    }); 

    modalLancar.present();
  }
8

I made a console.log inside that block and passed.

9

It seems that it was some problem with the life cycle, I used the ionviewdidenter and the part of the code was solved, now I have problems in the webservice, but that’s another case. Thank you very much for the answers and all the help.