modulos - manejo de eventos angular

El componente puede invocar un evento de autodestrucción.

Question

Tengo un componente principal que abre un nuevo componente al hacer clic en un enlace, se supone que este nuevo componente tiene un botón de cierre que, al cerrar, envía un mensaje de cierre al principal y se destruye.

Podemos enviar el mensaje de cierre utilizando el método ngOnDestroy , pero ¿cómo invoco la destrucción del componente secundario?

<parent>
    <child></child> //child to be opened on click but close 
                    //event should be inside the child componenet
</parent>

Corrígeme si estoy teniendo algún error conceptual aquí. Gracias

Answer 1

No estoy seguro de la limpieza de tal solución, pero utilicé:

this.viewContainerRef
    .element
    .nativeElement
    .parentElement
    .removeChild(this.viewContainerRef.element.nativeElement);

Answer 2

Si agrega un componente usando ViewContainerRef.createComponent() como se muestra en las pestañas dinámicas de Angular 2 con los componentes elegidos al hacer clic en el usuario , el componente puede destruirse solo cuando pasa cmpRef al componente creado.

De lo contrario no creo que haya una manera. Puede pasar un valor al padre para que un *ngIf elimine el componente.

<child *ngIf="showChild" (close)="showChild = false"></child>

class ParentComponent {
  showChild:boolean = true;
}

class ChildComponent {
  @Output() close = new EventEmitter();

  onClose() {
    this.close.emit(null);
  }
}