Estou começando agora com o angular e estou com uma dúvida, eu fiz uma tela de login.page.html, depois que o back-end confirma o login e senha o usuário vai para a tela home.page.html nesta tela o usuário terá acesso a um menu de consulta, cada usuário fará a sua consulta com o seu login/senha, mas o angular pelo que eu vi trabalha com classes e se eu setar o login e senha na classe LoginPage e instanciar essa classe na classe HomePage o valor de var login e var senha se perderá, eu li que tem vários jeitos de se fazer injeção, serviço mas não consegui aplicar nem entender nenhum desses conceitos, alguém pra me explicar?
import { Component, Inject, OnInit } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { ActivatedRoute, Router } from '@angular/router';
import { AlertController, MenuController } from '@ionic/angular';
@Component({
selector: 'app-login',
templateUrl: './login.page.html',
styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit {
public folder: string;
public login: string;
public senha: string;
constructor(
//private activatedRoute: ActivatedRoute,
private http: HttpClient,
private alertController: AlertController,
private menu: MenuController,
private router: Router
){
}
async ngOnInit() {
}
async alert(mensagem: string){
const alert = this.alertController.create({
header: 'Aviso', message: mensagem,buttons: ['Ok']
});
(await alert).present();
}
public conectar() {
let postData = { "log_login": this.login, "log_senha": this.senha };
this.http.post<any>( // Requisição Ajax
"http://localhost/appBTR/conectar.php", // URL
JSON.stringify(postData)) // Parametros
.subscribe( // Retorno
async data => { // Caso success
if( data == 0){ // Login e/ou Senha inválidos!
this.alert("Login e/ou Senha inválidos!"); // Aviso na tela
}
else{ this.telaInicio(postData); } // Caso login ok
},
async (error: HttpErrorResponse) => { // Caso error
this.alert(error.error.text);
}
);
}
telaInicio(postData: object){
// AQUI EU PRECISO DAR UM JEITO DE OU ENVIAR O posData para a home.page.ts
// OU TRANSFORMA-LO EM GLOBAL
this.menu.enable(true,'main-menu');
this.router.navigate(['home']);
}
}