angular8 Renderer2 获取div子级标签

可以使用Renderer2的query方法来获取div子级标签。具体代码如下：

import { Component, Renderer2, ElementRef, ViewChild } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
    <div #myDiv>
      <p>子级标签1</p>
      <p>子级标签2</p>
    </div>
  `,
})
export class AppComponent {
  @ViewChild('myDiv', { static: true }) myDiv: ElementRef;

  constructor(private renderer: Renderer2) {}

  ngAfterViewInit() {
    const divEls = this.renderer.selectores('p', this.myDiv.nativeElement);
    console.log(divEls);
  }
}

这段代码中，我们通过@ViewChild获取了模板中的div元素，并在ngAfterViewInit生命周期钩子中通过Renderer2的selectores方法来获取div子级的所有p标签。

相关问题

Angular 9中获取div 子级的高度

在Angular 9中，获取`<div>`子级高度通常有两种方法，取决于你是在组件内还是外部需要获取：

1. **组件内部**:
- 使用`ViewChild`装饰器：假设你要获取的子元素是`childElement`，在你的组件的类里添加如下属性：

     @ViewChild('childElement') childElement: ElementRef;

- 然后你可以在需要的时候通过`nativeElement`属性获取元素高度：

     this.childElement.nativeElement.offsetHeight;

2. **组件外部（例如服务、管道等）**:
- 如果在非组件上下文中，你可以创建一个服务并注入`Renderer2`或`ElementRef`服务：

     import { ComponentRef, Renderer2 } from '@angular/core';

     export class HeightService {
       constructor(private renderer: Renderer2) {}

       getHeight(elementId: string): number {
         const element = document.getElementById(elementId);
         return element ? element.offsetHeight : null;
       }
     }

- 调用这个服务的方法，传入子元素的ID即可。

记住要在Angular运行周期（如`ngAfterViewInit`）中获取高度，因为DOM可能在初始化后才会完全加载完成。