Skip to main content
2 de 2
AngularJS(Angular 1) y Angular(Angular 2+) son considerados frameworks distintos. Aquí se utiliza Angular por tanto lo correcto es poner esa etiqueta en la pregunta para evitar confusiones y que aparezca en las búsquedas de la etiqueta correspondiente.

¿Cómo enviar el valor de una variable proveniente de un componente y recibirlo en otro componente? Angular / Ionic 4-5

Quiero enviar el valor de una variable para posteriormente utilizarlo en otro componente. Pero al momento que imprimo ese valor traído desde un servicio, en la consola me aparece 'undefined'

Esta es el componente de donde quiero mandar el valor de la variable 'message' y su valor 'Hola desde home'

import { Component } from '@angular/core';
import { ShareService } from '../share.service';



@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  message: any;

  constructor( private shareSvc: ShareService ) {}

  ngOnInit() {
    // this.shareSvc.sharedMessage.subscribe(message => this.message = message)

    this.message = 'Hola desde home';
   
    this.shareSvc.varService = this.message;

  }
  
}

Este es mi servicio, donde solamente estoy declarando la variable varService

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class ShareService {
  // private message = new BehaviorSubject<any> (null) ;
  // sharedMessage = this.message.asObservable();
  public varService : any;

  constructor() { }

  // nextMessage(message: string) {
  //   this.message.next(message)
  // }
}


Y esta es el componente donde quiero obtener el valor traído desde home.ts y utilizando el servicio como intermediario

import { Component, OnInit } from '@angular/core';
import { ShareService } from '../share.service';



@Component({
  selector: 'app-pagina2',
  templateUrl: './pagina2.page.html',
  styleUrls: ['./pagina2.page.scss'],
})
export class Pagina2Page implements OnInit {

  

  constructor( private shareSvc: ShareService) { }

  ngOnInit() {

    console.log(this.shareSvc.varService);
    // this.shareSvc.sharedMessage.subscribe(message => {
    //   this.message = message;
    // });
    // this.newMessage();

  }

  // newMessage() {
  //   this.shareSvc.nextMessage("I am from page 2")
  // }


}