Angular 2+ Как получить ширину пикселя деления во время выполнения

Question

Div выглядит так:

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

Контейнер - это строка flexbox, если это имеет значение, которая содержит элементы; Мне нужно знать, подходит ли новый элемент, который я добавляю в строку, без переноса.

Таким образом, мой код будет суммировать общие размеры каждого элемента в контейнере и сравнивать его с размером #container.

Код выглядит так:

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

Вот где проблема. Я не думаю, что это offsetWidth, потому что числа, которые я получал, были больше похожи на маржу слева. Там нет элемента "ширина", хотя, если я смотрю в:

this.pillContainer.nativeElement.attributes. xxxx

Я нахожу и элемент, называемый (с двойными кавычками) "width", но я не видел способа получить значение этого атрибута.

Есть идеи? Заранее спасибо, йог

Answer 1

В соответствии с документацией, на которую я наткнулся, я был на самом деле неправ: offsetWidth фактически возвращает ширину элемента, включая границы, НО это не включает поля. Кажется, что getBoundingClientRect() может быть более полезным, так как он показывает эффект любого преобразования, которое было применено.
Я думаю, что этого достаточно для моей проблемы. Йог