小编Iva*_*van的帖子

访问组件内的模板变量

我遇到了 ng-template 的问题。

我们通过 ngTemplateOutletContext 在表格组件中传递一些参数,如下所示。我们根据其中包含的数据类型为单元格使用不同的渲染器。注意 cellvalue 参数,因为它是我需要的。

<ng-container *ngIf="useCellRenderer(column, row)">
   <ng-template [ngTemplateOutlet]="column.renderer.templateref" [ngTemplateOutletContext]="{ cellvalue: row[column.attr], rowvalue:row }">
   </ng-template>
</ng-container>
Run Code Online (Sandbox Code Playgroud)

负责渲染的组件的模板如下所示:

<ng-template #templateRef let-cellvalue="cellvalue" let-rowvalue="rowvalue">
  {{ getTraslateValue(cellvalue)}}
</ng-template>
Run Code Online (Sandbox Code Playgroud)

该模板能够访问 cellvalue 参数并正确调用该函数,但是我想从组件的 TS 访问相同的参数并且似乎无法做到这一点。

到目前为止我尝试过的内容与以下代码段一致

@ViewChild('templateRef', { read: TemplateRef })
  public templateref: TemplateRef<any>;

  ngAfterViewInit() {
    console.log('ngAfterViewInit', this.templateref.elementRef);
  }
Run Code Online (Sandbox Code Playgroud)

但是在console.log中找不到cellvalue

提前致谢!

javascript typescript angular angular5

5
推荐指数
1
解决办法
1638
查看次数

标签 统计

angular ×1

angular5 ×1

javascript ×1

typescript ×1