Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Utilizar a função em outras páginas

Como eu uso a função obtemUsuarioLogado() em outras páginas do App ? Depois como eu consigo pegar um valor específico do retorno da função?

5 respostas

Boa noite, Eduardo! Como vai?

Como eu uso a função obtemUsuarioLogado() em outras páginas do App?

Basta injetar o UsuarioProvider nas classes de controle das páginas que vc desejar, igual foi feito durante o curso na classe MyApp, no arquivo app.component.ts.

@Component({
  selector: 'myapp',
  templateUrl: 'app.html'
})
export class MyApp {

  constructor(
    // injetando o UsuarioProvider
    private _usuariosService: UsuariosProvider) {}

  get usuarioLogado() {

    // usando o UsuarioProvider
    return this._usuariosService.obtemUsuarioLogado();
  }
}

Depois como eu consigo pegar um valor específico do retorno da função?

Não entendi essa segunda pergunta.

Então o retorno da função me traz um objeto com vários valores. Eu preciso pegar o valor do id do usuário pra usar na página home.ts


import { Component } from '@angular/core'; import { NavController, LoadingController, AlertController } from 'ionic-angular';

import { HttpErrorResponse } from '@angular/common/http';

import { Projeto } from '../../modelos/projeto';

import { NavLifecycles } from '../../utils/ionic/nav/nav-lifecycles'; import { ProjetosServiceProvider } from '../../providers/projetos-service/projetos-service'; import { ProjetoPage } from '../projeto/projeto';

import { UsuariosServiceProvider } from '../../providers/usuarios-service/usuarios-service';

@Component({ selector: 'page-home', templateUrl: 'home.html' })

export class HomePage implements NavLifecycles {

public projetos: Projeto[];

constructor( public navCtrl: NavController, private _loadingCtrl: LoadingController, private _alertCtrl: AlertController, private _projetosProvider: ProjetosServiceProvider, private _usuariosService: UsuariosServiceProvider) {}

get usuarioLogado(){ return this._usuariosService.obtemUsuarioLogado(); }

ionViewDidLoad(){

// quero aqui pegar o valor do idPessoa que esta sendo passado na função

let loading = this._loadingCtrl.create({ content: 'Caregando lista de Projetos...' }); loading.present(); this._projetosProvider.lista(null) .subscribe( (projetos) => { this.projetos = projetos; //console.log(this.projetos); loading.dismiss(); }, (err: HttpErrorResponse) => { console.log(err); loading.dismiss(); this._alertCtrl.create({ title: 'Falha na Conexão.', subTitle: 'Não foi possivel carregar a lista de projetos.', buttons: [ {text: 'Ok'} ] }).present(); } ); }

selecionaProjeto(projeto: Projeto){ console.log(projeto); this.navCtrl.push(ProjetoPage, { projetoSelecionado: projeto }); } }

Entendi, Eduardo!

Bom, eu não vi nenhum objeto do tipo Usuario em seu código e como vc tbm não indicou qual objeto quer manipular eu não tenho como responder especificamente como vc fará!

Mas, considerando que vc tenha um objeto usuario do tipo Usuario com uma propriedade chamada id, para acessar essa propriedade bastaria fazer usuario.id.

DICA: Eu vi em seu perfil que vc não fez os cursos de Javascript da Alura. Fazer os cursos dessa linguagem é essencial para ter uma boa base e aproveitar ao máximo os cursos um pouco mais avançados como é esse de Ionic 3!

Aprendizado para a vida: Sempre que for mandar um código aqui no fórum utilize o botão "inserir código" e cole o código no lugar indicado. Caso contrário, o código ficará sem formatação nenhuma o que dificulta o entendimento e posterior ajuda.

Então, vou estruturar melhor a pergunta. Obrigado pelas dicas.

Pergunta: Estou fazendo o curso de Ionic 3 tendo você como instrutor. Sobre o login você ensinou como pegar os dados do usuário logado e usar em outras páginas (html), mas eu preciso usar uma propriedade do objeto ainda no código (.ts) da página que estou recuperando os dados. Segue meu código da página home.ts, onde recupero o usuário logado. Não estou conseguindo usar uma propriedade na página.

home.ts

import { Component } from '@angular/core';
import { NavController, LoadingController, AlertController  } from 'ionic-angular';

import { HttpErrorResponse } from '@angular/common/http';

import { Projeto } from '../../modelos/projeto';

import { NavLifecycles } from '../../utils/ionic/nav/nav-lifecycles';
import { ProjetosServiceProvider } from '../../providers/projetos-service/projetos-service';
import { ProjetoPage } from '../projeto/projeto';

import { UsuariosServiceProvider } from '../../providers/usuarios-service/usuarios-service';
import { Usuario } from '../../modelos/usuario';

@Component({
   selector: 'page-home',
   templateUrl: 'home.html'
})

export class HomePage implements NavLifecycles {

  public projetos: Projeto[];

  constructor(
      public navCtrl: NavController,
      private _loadingCtrl: LoadingController,
      private _alertCtrl: AlertController,
      private _projetosProvider: ProjetosServiceProvider,
      private _usuariosService: UsuariosServiceProvider) {}

      get usuarioLogado(){
        return this._usuariosService.obtemUsuarioLogado();
      }

      ionViewDidLoad(){

        let loading = this._loadingCtrl.create({
          content: 'Caregando lista de Projetos...'
        });
        loading.present();
        this._projetosProvider.lista(null)
          .subscribe(
            (projetos) => {
              this.projetos = projetos;
              //console.log(this.projetos);
              loading.dismiss();
            },
            (err: HttpErrorResponse) => {
              console.log(err);
              loading.dismiss();
              this._alertCtrl.create({
                title: 'Falha na Conexão.',
                subTitle: 'Não foi possivel carregar a lista de projetos.',
                buttons: [
                  {text: 'Ok'}
                ]
              }).present();
            }
          );
        }

        selecionaProjeto(projeto: Projeto){
          console.log(projeto);
          this.navCtrl.push(ProjetoPage, {
            projetoSelecionado: projeto
          });
        }
     }
solução!

Eduardo, quando vc faz this._usuariosService.obtemUsuarioLogado() vc está pegando o usuário logado. Então vc poderia fazer algo do tipo:

export class HomePage implements NavLifecycles {

  public usuarioLogado: Usuario;

  constructor(
      public navCtrl: NavController,
      private _loadingCtrl: LoadingController,
      private _alertCtrl: AlertController,
      private _projetosProvider: ProjetosServiceProvider,
      private _usuariosService: UsuariosServiceProvider) {

          // agora que armazenou o usuário, vc pode utilizar ele como quiser!
          this.usuarioLogado = this._usuariosService.obtemUsuarioLogado();
  }

  get usuarioLogado(){
      return this.usuarioLogado;
  }
}

Pegou a ideia?

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software