0

Un saludo a todos

Actualmente tengo 3 componentes que se están comunicando entre sí. Se que con los decoradores @input puedo pasar información del padre al hijo. Pero no se como puedo ejecutar un método del hijo desde el padre.

introducir la descripción de la imagen aquí

Como puedo hacer que cuando se ejecute el método guardarSolicitud() del componente Solicitud, también se ejecute el método servicioAPIGuardar() del componente Codeudor.

Esto es debido a que al guardar la solicitud se obtiene un id que se usa para relacionar a los deudores con la solicitud en la BD.

Para que pase algo como

guardarSolicitud() {

    let solicitudData: any = {
      ...this.solicitudForm.value,
    };

    this.solicitudesService.createSolicitud(solicitudData)
      .pipe(finalize(() => {
        this.wizard.next();
        window.scroll(0, 0);
      }))
      .subscribe(data => {
          this.solicitudArrendamiento = data;
          this.idSolicitud = data['id']; // El idSolicitud se está enviado por medio de un @input.

          servicioAPIGuardar(); //Este método no esta aquí, pero es donde quiero que se ejecute.

        }, error => {
          log.debug(`Solicitud error: ${error.message}`);
        }
    );
}
5
  • Agrega la información del componente padre o hijo donde quieres ejecutar el método, ademas agrega como estas llamando a los componentes dentro de los otros componentes los selectores y variables de acceso el 1 feb. 2020 a las 16:05
  • La idea es que suceda en el método guardarSolicitud() o más concretamente al final del subscribe, ya que allí es donde obtengo como resultado el id de la solicitud, este lo envío a través de un @input, lo que no sé es como ejecuto el método del hijo servicioAPIGuardar()
    – Ceragos
    el 1 feb. 2020 a las 16:21
  • Por eso te digo que subas el codigo , ya que con eso es mas facil ayudarte, edita tu pregunta el 1 feb. 2020 a las 16:24
  • Pregunta actualizada
    – Ceragos
    el 1 feb. 2020 a las 18:48
  • Ese codigo que agregas, es de cual componente ? te digo que subas los componentes por que necesito saber como estas llamando cada componente para su comunicacion , supongo que debes de tener algo como esto @ViewChild('infoJuridicoComponent', { static: false }) infoJuridicoComponent: InfoJuridicosComponent; o no se como estas comunicando, no se como tienes declarado la variables dices en un @input pero no se que tipo de dato, lo que yo hago para acceder a metodos de otros componentes es llamar la variable InfoJuridicosComponent y ya accedes el 3 feb. 2020 a las 13:48

1 respuesta 1

1

Tienes varias maneras de resolver este problema pero te ejemplifico las dos mas comunes:

  • Servicio compartido

Servicio

export class ServiceExample {

    $emitter = new EventEmitter();

    emitirEvento() {
        this.$emitter.emit();
    }   

}

Componente padre

export class PadreComponent {

 constructor(service: ServiceExample) {}

 guardarSolicitud() {
     // Tu código...
     this.service.emitirEvento();
 }

}

Componente hijo

export class PadreComponent {

 constructor(service: ServiceExample) {
   service.$emitter.subscribe(() => {
     this.servicioAPIGuardar()
   });
 }

 servicioAPIGuardar() {
   // Tu código
 }

}

  • Con referencia de elemento

Componente padre

export class ComponentePadre {

    @ViewChild(ComponenteHijo) hijo: ComponenteHijo;

    guardarSolicitud() {
         // Tu código...
         this.hijo.servicioAPIGuardar();
    }

}
1
  • Muchas gracias, es justo lo que necesitaba, lo implemente con el objeto emitter y funciona perfecto.
    – Ceragos
    el 5 feb. 2020 a las 13:34

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.