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:
Esse foi um post rápido para demonstrar com esse passo é simples ;) Espero ter ajudado e até a próxima pessoal ;)