Refresh page when coming back from another Ionic/angular page

Asked

Viewed 758 times

-1

Good morning guys, I’m having a problem inserting/editing/deleting data in db, I have a client page that lists the names, the buttons that make use of the functions I mentioned lead to a new component add-clients, after inserting/editing/deleting some data back to the clients page using router.navigate(), however the data is not updated, I would like to reload the content of the page when returning from another screen, ngOnInit only loads the first time I access the page, then it’s as if she’s always active.

I would just like to know how to update the content of the clients page whenever I return from the other page I use to add/Edit/del ;/

Thank you in advance :)

clients.page

ngOnInit() {

    this.clientes = [];
    this.start = 0;
    this.carregar();
  }


carregar() {

    return new Promise(resolve => {

      let dados = {
        requisisao: 'getdata',
        limit : this.limit,
        start : this.start
      };
      this.service.inserirApi(dados, 'inserirCliente.php').subscribe(data => {
        for(let cliente of data['result']){
          this.clientes.push(cliente);          
        }
        resolve(true);
      });
    });
  }


 addClient() {
    this.router.navigate(['/add-cliente']);
  }

  editar(id, nome, telefone, email, mode) {
    this.router.navigate(['add-cliente/', { id, nome, telefone, email, mode }]);
  }

  excluir(id, nome, telefone, email, mode) {    
    this.router.navigate(['add-cliente/', { id, nome, telefone, email, mode }]);

  }

add-customer.page

cadastrar() {

    this.msg = "Dados inseridos com sucesso.";

    return new Promise(resolve => {

      let dados = {
        requisisao: 'add',
        nome: this.nome,
        email: this.email,
        telefone: this.telefone
      };
      this.service.inserirApi(dados, 'inserirCliente.php')
      .subscribe(data => {
        this.router.navigate(['/clientes']);
        this.msgOk();
      });
    });
  }

  addEditar() {

    this.msg = "Dados alterados com sucesso.";

    return new Promise(resolve => {

      let dados = {
        requisisao: 'edit',
        nome: this.nome,
        email: this.email,
        telefone: this.telefone,
        id: this.id
      };
      this.service.inserirApi(dados, 'inserirCliente.php')
      .subscribe(data => {
        this.router.navigate(['/clientes',{ rec:1 }]);
        this.msgOk();
        console.log(this.id);
      });
    });
  }

  addDelete() {

    this.msg = "Dados deletados com sucesso.";

    return new Promise(resolve => {

      let dados = {
        requisisao: 'delete',
        id: this.id
      };
      this.service.inserirApi(dados, 'inserirCliente.php')
      .subscribe(data => {
        this.router.navigate(['/clientes']);
        this.msgOk();
      });
    });
  }

inserir a descrição da imagem aquiinserir a descrição da imagem aqui

ionic

  • Ola @Hyroshima, do not change the question to indicate that you have found an answer. The best to do in this case and publish a reply, after 48 hours the system will release for you to accept your own answer, you can still see your change here. -- I can answer my own question?

1 answer

0


Solution

After checking the life cycle of the page I realized using ngOnInit was unfeasible because as it was a page that needed updating whenever some event happened, so I just removed the call of the function load as well as the variables there and I stored them in ionViewWillEnter leaving it asism:

 ngOnInit() {}

  ionViewWillEnter() {
    this.clientes = [];
    this.start = 0;
    this.carregar();    
  }

Browser other questions tagged ionic

You are not signed in. Login or sign up in order to post.