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