最近做一個項目需要用到前端插件處理視頻,中間有一個操作DOM的過程,但是執行時發現HTMLCollection為空
打印數據是有的,查看代碼后發現問題出在DOM還未渲染結束,就執行了代碼
angular2開始已經定義了引用類型ElementRef,直接上代碼
html
<div #wrapper>
</div>
<div (click)="showWrapper()">
</div>
ts先引入TemplateRef
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
然后再調用
export class VideoDownloadComponent implements OnInit {
@ViewChild('wrapper') wrapper: ElementRef;
constructor() {
}
ngOnInit(){
}
showWrapper(){
let wrapperDOM = this.wrapper.nativeElement ; // 這就是獲取到的DOM元素
}
}
