0

Hola tengo una solicitud que se me ha hecho tediosa, tengo la siguiente etiqueta en el html

<a (click)="ngOnInit()"><li id="creacionCon" #creacion>Crear Contrato sin Precontrato Sinergia</li></a>

cuando doy click lo que realizo es que llamo el ngOninit pero del componente hijo desde el del padre.

 @ViewChild(AdminContratosCreaconComponent) creacon!: AdminContratosCreaconComponent;
ngOnInit(): void {    
 this.creacon.ngOnInit();
}

realice esta funcionalidad asi ya que el cliente lo solicito que fuera tipo hipervinculo y no como boton, el requiere que siempre que se de click vuelva a iniciarse el componente hijo y cargue los datos del mismo.

El inconveniente que presento es que siempre que arranca el ngOnInit de mi componente padre me genera el siguiente error. introducir la descripción de la imagen aquí

este error lo genera cuando se inicializa el componente padre y trata de llamar al componente hijo. Alguno me podria ayudar por favor!!

1 respuesta 1

0

Te dejo un ejemplo que resuelve el problema:

@Component({
  standalone: true,
  selector: 'child',
  template: `{{random}}`,
})
export class Child {
  random = 0;
  // función que imita un reinicio o cambio del estado del componente
  // desde el padre
  reload() {
    this.random = Math.random();
  }
}

@Component({
  selector: 'my-app',
  standalone: true,
  imports: [CommonModule, Child],
  template: `
  <a (click)="updateChild()">actualizar</a>
  <br><br>
    <child></child>
  `,
})
export class App {
  // se hace referencia al componente `Child`
  @ViewChild(Child) childView: Child;
  // se crea una función en el padre para llamar la función
  // `reload` del componente Child
  updateChild() {
    this.childView.reload();
  }
}

Código en vivo

Adicional a eso: no llames a las funciones del ciclo de vida ngOnInit, ngAfterViewInit, etc... directamente, es el framework el que debe encargarse de eso, llamarlas directamente puede introducir bugs a la aplicación.

3
  • Hola trate de utilizar el reload pero me actualiza toda la pgina y yo solo necesito que me vuelva a inicializar lo correspondiente a ese componente hijo el 14 feb. 2023 a las 23:12
  • ¿Cómo usaste el reload?
    – Lobos
    el 14 feb. 2023 a las 23:14
  • En el componente padre: importe el componente hijo como VieChild @ViewChild(AdminContratosConsconComponent) conscon: AdminContratosConsconComponent; y en un metodo llame la funcion reload que cree en mi componente hijo this.conscon.reload(); en mi componente Hijo lo cree asi: random = 0; reload(){ this.random = Math.random(); } cuando le doy clic por primera vez me inicializa el componente pero al volverle a dar no hace nada y no me genera tampoco error el 14 feb. 2023 a las 23:27

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.