时间戳

首页 > 解决方案 > 创建子组件并调用函数。角 5.2.1

angular - 创建子组件并调用函数。角 5.2.1

问题描述

我在父组件中有一个表，当单击一行时，我绘制了一个子组件，该子组件的 ngIf 为 false 直到那一刻。

在我要绘制子组件的那一刻，调用子组件的函数并将行传递给它，我不仅要传递数据，我还必须在子组件中处理它，这就是为什么我需要调用函数

//查看父亲

<jhi-gestion-imputacion-detalle
  (volverEvent)="volverDetalle($event)"
  [childReportesParte]="parentReportesParte"
  [parentVerTabla]="childVerTabla"
  *ngIf="!parentVerTabla"
>
</jhi-gestion-imputacion-detalle>

....

 <tr (click)="detalle(parte)">

// 控制器父亲

ViewChild(GestionImputacionDetalleComponent) child: GestionImputacionDetalleComponent;

detalle(parte: GestionImputacionData) {
    this.parentVerTabla = false;
    this.parte = parte;
    this.child.cargar(this.parte); <-- child is undefined
}

问题是“孩子”是未定义的。我在论坛中看到的是“AfterViewInit”，但那是控制器启动的时候，不像我需要的那样，通过单击父组件表的一行来绘制子组件。

如何通过单击表格的行来绘制子组件，并且可以在创建它时调用它的函数。

标签： angular

解决方案

您应该使用[hidden]从 DOM 中隐藏子组件。

*ngIf从 DOM 中删除子组件，因此@viewChild()将不起作用。但是使用[hidden]，您只会隐藏元素，因此@viewChild()可以使用。

<jhi-gestion-imputacion-detalle
  (volverEvent)="volverDetalle($event)"
  [childReportesParte]="parentReportesParte"
  [parentVerTabla]="childVerTabla"
  [hidden]="parentVerTabla"
>
  • [隐藏]display: none; -根据条件为元素的样式添加属性。
  • *ngIf - 根据条件从 DOM 中添加/删除元素。

推荐阅读