Estoy creando múltiples componentes de menú desplegable con un botón en el padre, pero quiero que esos componentes tengan botones que se destruyan a sí mismos. Estoy seguro de que es simple, pero parece que no puedo encontrar nada que lo haga. Sé cómo destruirlo desde el padre, pero parece que no puedo hacerlo desde adentro. ¿Nadie sabe? Y justo antes de que se destruya, ¿cómo puedo enviar un mensaje a los padres informándoles? (Tengo instancias de ellos en el padre, pero hay otras cosas en el padre que necesitan una señal)
Los estoy creando dinámicamente usando viewContainerRef.createComponent . La plantilla se ve así:
<template item-host></template>Probé un @Output y obtuve esto:
<template item-host [ERROR ->](destroyCheck)="someMethod($event)"></template>usar ComponentRef.destroy()
si crea componentes dinámicamente usando viewContainerRef.createComponent, puede destruirlo con ComponentRef.destroy(). todo lo que necesita es ver la referencia a sí mismo en el componente, como en el ejemplo:
padre:
... const componentRef = this.placeholder.createComponent( this.resolver.resolveComponentFactory(SOMECOMP)); componentRef.instance.viewRef = componentRef; ...niño:
viewRef: ComponentRef<SOMECOMP>; ... this.viewRef.destroy(); ...Declarar una variable de salida
@Output() destroyCheck:EventEmitter<string>=new EventEmitter<string>(); ngOnDestroy(){ this.destroyCheck.emit('destroyed'); }En su componente principal, maneje de esta manera.
<div> <child-comp (destroyCheck)="someMethod($event)"> </child-comp> </div>Su método debe ser manejado como
someMethod(something){ console.log(something); }