Angular 2：如何通过CSS Selector在@ViewChild中查找子元素？

发布时间：2020-12-17 17:33:32 所属栏目：安全来源：网络整理

导读：我想通过nth-child()选择器或类改变第二个p的样式： import { Component,ViewChild } from '@angular/core';@Component({ selector: 'my-app',template: ` div #container ppara 1/p p class="my-class"para 2/p buttonbutton 1/button /div `})export class

我想通过nth-child()选择器或类改变第二个p的样式：

import { Component,ViewChild } from '@angular/core';
@Component({
  selector: 'my-app',template: `
    <div #container>
        <p>para 1</p>
        <p class="my-class">para 2</p>
        <button>button 1</button>
    </div>
  `
})
export class AppComponent {
  @ViewChild('container') myDiv;
  ngAfterViewInit(){
    console.log(this.myDiv.nativeElement.children);
  } 
}

解决方法

以下代码将为您提供来自view child的子元素

let children = this.myDiv.nativeElement.getElementsByTagName("p");

请参阅plunker代码

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!