html - Angular 2+ 如何在运行时获取 div 的像素宽度

Question

div 看起来像这样：

<div #container [ngStyle]=...>

如果包含元素很重要，则容器是一个 flexbox 行；我需要知道我添加到行中的新元素是否适合而不引起换行。

因此，我的代码将总结容器中每个元素的总大小，并将其与#container 的大小进行比较。

代码是这样的：

#ViewChild('container') pillContainer: ElementRef;
let maxWidth = this.pillContainer.nativeElement.????

这就是问题所在。我不认为它是 offsetWidth ，因为我得到的数字更像是左边距。但是，如果我查看以下内容，则没有“宽度”元素：

this.pillContainer.nativeElement.attributes. xxxx

我确实找到了一个名为（用双引号）“宽度”的元素，但我没有看到获取该属性值的方法。

有任何想法吗？在此先感谢，瑜伽士

score 0 · Accepted Answer

根据我偶然发现的文档，我实际上是错的： offsetWidth 实际上确实返回了元素的宽度，包括边框，但它不包括边距。似乎 getBoundingClientRect() 可能更有用，因为它显示了应用的任何转换的效果。
我认为这足以解决我的问题。瑜伽士

1 回答 1