相关疑难解决方法(0)

在我的一个组件的 html 中，我们使用了一些<ng-template>标签。

在标签内部，我们想定义一个引用来访问nativeElementdiv 中的@ViewChild。

我想要恢复的元素 Ref 在 tabset 指令中，在子指令 p-datatable sub 的 ng-template 中。

这是我们的 component.html 代码（我们使用 primeNG 和 ngx-bootstrap 模块和选项卡/数据表指令）：

<tabset #staticTabs>
    <tab>
        <ng-template tabHeading>
            <span class="hidden-sm-down">
                Tab Header Text
            </span>
        </ng-template>          
        <p-dataTable [value]="data">
            <p-column field="id" header="Id"></p-column>
            <p-column field="context" header="Context">
                <ng-template let-context="rowData" pTemplate="body">
                    <div class="container" #iWantThisElementNative></div>
                </ng-template>
            </p-column>
        </p-dataTable>
    </tab>
</tabset>

还有我们的 component.ts：

export class AppComponent implements OnInit, AfterViewInit {
  @ViewChild('iWantThisElementNative') iWantThisElementNative;

  ...

  ngAfterViewInit() {
    console.log(this.iWantThisElementNative.nativeElement);
  }
}

我们遇到的错误：

错误错误：未捕获（承诺）：类型错误：无法读取未定义的属性“nativeElement”

我试图移动带有标签集顶部的引用的 div，它工作正常。我试图将 …