angular怎么获取DOM节点

1.直接获取dom节点
//< div >wo shi yi ge div< /div>
//< div ngfor ngif…>w o s hi yi ge div</ div >
第一种可以直接在ngOnInit(){}中直接获取,第二种不可以
**ngOnInit(){}**组件和指令初始化完成,并不是真正的dom加载完成
ViewChild
2.通过ViewChild获取dom节点,ngAfterViewInit()里面写
两种都可以获取,
//<div #box> 获取DOM节点</ div>

@Component({
selector: ‘app-dom’,
templateUrl: ‘./dom.component.html’,
styleUrls: [’./dom.component.css’]
})
export class DomComponent implements OnInit {
//获取dom节点
@ViewChild(‘box’,{static:true}) mybox:any;
//调用子组件
@ViewChild(‘domson’,{static:true}) mydomson:any;
constructor() { }

ngOnInit() {
}
ngAfterViewInit(): void {

console.log(this.mybox);
this.mybox.nativeElement.style.width='50px';
this.mybox.nativeElement.style.height='50px';
this.mybox.nativeElement.style.backgroundColor='red';

//调用子组件的方法
this.mydomson.run();
}

}

3.ViewChild还可以调用子组件
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值