如何从htmlelement (elementref)获取子元素的宽度

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

@Component({
  selector: 'app-example',
  template: `
    <div #parentElement>
      <div class="child-element">Child Element 1</div>
      <div class="child-element">Child Element 2</div>
      <div class="child-element">Child Element 3</div>
    </div>
  `,
  styles: [
    `
    .child-element {
      width: 100px;
      height: 50px;
      background-color: #ccc;
      margin-bottom: 10px;
    }
    `
  ]
})
export class ExampleComponent implements AfterViewInit {
  constructor(private elementRef: ElementRef) {}

  ngAfterViewInit() {
    const parentElement = this.elementRef.nativeElement.querySelector('#parentElement');
    const childElements = parentElement.querySelectorAll('.child-element');

    childElements.forEach((element: HTMLElement) => {
      const width = element.clientWidth;
      console.log(`Child element width: ${width}px`);
    });
  }
}