在Angular中访问自定义HTML元素方法

Question

我使用的框架类似于Angular中的bootstrap，它提供自定义HTML元素，比如，我想通过点击按钮来更新表。在我的typescript文件中，我有代码来获取元素

(<HTMLTableElement>document.getElementById("resultTable")).updateRows()

和我得到的问题是，当我将它转换为HTMLElement时，预定义的方法，如updateRows()不起作用，我得到的错误消息是属性updateRows不存在于HTML元素上。是否有一种方法可以让我调用自定义方法，以便我可以使用自定义元素?非常感谢!

(<HTMLTableElement>document.getElementById("resultTable")).updateRows()

Answer 1

为什么不查看child?

首先在component.html文件

中添加对html元素的引用

<result-table #resultTable>...</result-table>

然后你可以使用viewChild

获取该元素

export class ExampleComponent {
@ViewChild('resultTable') resultTable: ElementRef<any>;
ngAfterViewInit() {
const element = this.resultTable && this.resultTable.nativeElement ?  this.resultTable.nativeElement: this.resultTable;
element.updateRows();
}