如何在Angular2中查找DOM元素的子元素和父元素

前端之家收集整理的这篇文章主要介绍了如何在Angular2中查找DOM元素的子元素和父元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我知道我可以获取组件的DOM元素
constructor(el: ElementRef){}

但是我如何访问其子女(例如通过按类或ID搜索)和主持人?

el.nativeElement.children
el.nativeElement.parent
el.nativeElement.host

一切都行不通.

我一直在寻找答案,没有运气.非常感谢您的帮助.

编辑感谢yurzui的评论,我意识到el.nativeElement.children在组件的视图初始化后工作.但是我仍然无法访问主机元素.

另外,正如JB Nizet指出的那样,在Angular2中操作DOM元素是不公平的.但是,我在组件类中需要的DOM元素的唯一内容是元素的宽度.如果我知道如何将此值绑定到类属性,我会在不访问DOM的情况下解决问题.我之前尝试过类似的东西

<div [width] = "style.width"></div>

(width是我的组件类的属性,其视图包含上面的div)但我无法使其工作.

尝试在ngAfterViewInit事件中使用您的代码.

并且您需要使用parentNode属性而不是parent

export class App {
  el: ElementRef;
  constructor(el: ElementRef){
    this.el = el; 
  },ngAfterViewInit() {
    const hostElem = this.el.nativeElement;
    console.log(hostElem.children);
    console.log(hostElem.parentNode);
  }
}

https://plnkr.co/edit/iTmsNaIoU9NNUEFRe4kG?p=preview

原文链接:https://www.f2er.com/angularjs/141920.html

猜你在找的Angularjs相关文章