Ionic 3: Passando valores entre as páginas


Ionic 3: Passando valores entre as páginas

Dando continuidade ao meu artigo anterior: Criando um projeto do zero com rotas, hoje irei demonstrar como passar dois valores através de parâmetros para uma página em um projeto desenvolvido com Ionic 3.


Com o projeto desenvolvido no artigo anterior aberto no seu editor de textos, atualize os arquivos: home.ts, home.html e sobre.ts com os trechos de código abaixo:

En home.html eu removi o link e adicionei um evento de click.

<button ion-button (click)="pushPage()">Sobre</button>

Em home.ts eu criei uma função que irá passar um parâmetro id e um outro chamado name para a página Sobre:

pushPage() {
  this.navCtrl.push(SobrePage, {
  id: "123",
  name: "Carl"
 });
}

Por fim em sobre.ts eu estou recebendo os dados no meu controller e passando para dois consoles:

constructor(public navCtrl: NavController, public navParams: NavParams) {
  let id = navParams.get('id');
  let name = navParams.get('name');
  console.log(id);
  console.log(name);
}

Agora execute o projeto e note os valores sendo printados no console do seu navegador. Abaixo você tem uma imagem demonstrando esse passo:

passando valores entre as páginas (Ionic 3)

Esse foi um post rápido para demonstrar com esse passo é simples 😉 Espero ter ajudado e até a próxima pessoal 😉

Compartilhe:

Share on facebook
Facebook
Share on twitter
Twitter
Share on pinterest
Pinterest
Share on linkedin
LinkedIn

Table of Contents

Postagens Relacionadas

Maze Runner – Correr ou Morrer

Maze Runner – Correr ou Morrer O filme mostra o jovem Thomas (Dylan O’Brien), que vai parar em um lugar desconhecido, sem memória que o
TheWildsVidasSelvagens

the wilds: vidas selvagens

The Wilds: Vidas Selvagens The Wilds: Vidas Selvagens é uma série dramática de TV americana criada por Sarah Streicher que foi lançada no Prime Video
RockBottomRiser

Rock Bottom Riser

Rock Bottom Riser 01/03/2021(US) – Documentário – 1h 10min –   Nota: 0/10   Sinopse     Elenco Nainoa Thompson Como – master navigator Moses
SaferatHome

Safer at Home

Safer at Home 26/02/2021(US) – Filmes – 0h 0min –   Nota: 0/10   Sinopse     Elenco Mais informações Título Original Safer at Home