Как определить изменение размера HTMLElement, если ширина указана в процентах

Question

Я разрабатываю угловой компонент и использую этот код CSS.

:host {
  display: block;
  width: 100%;
}

Идея состоит в том, чтобы сделать компонент максимально отзывчивым.

Моя проблема в том, что мне нужносделать некоторую логику всякий раз, когда моя ширина компонента изменяется. Предпочтительный способ (MutationObserver) не работает с шириной компонента, установленной в процентах, потому что если с изменениями, он всегда будет равен 100%, поэтому обратный вызов наблюдателя мутации не срабатывает.

Я где-то читал о размещении логикиможет ли кто-нибудь сказать мне, есть ли в другом велосипедном крючке DoCheck какой-либо другой хороший способ сделать то, что я недоделал?

Answer 1

Я думаю, что у вас есть два варианта:

1. используйте window.addEventListener('resize', reportWindowSize); При первой загрузке вы должны сохранить исходное измерение div и когда размер окна изменяется, вы проверяете оригинал противтекущее измерение div и, если оно изменилось, используйте вашу собственную логику.
2. Следуйте этой библиотеке элементов CSS библиотеке, описанной в этой теме.