Пример плункера: http://plnkr.co/edit/YLLslImGOpS8u6zx
В плунжере я отображаю высоту и ширину div от родительского компонента, используя ViewChild
.
I передать div из родительского компонента в дочерний компонент в качестве входного HTMLElement, а в дочернем компоненте я снова прочитал currentValue
этого ввода. Если вы откроете консоль браузера, я зарегистрирую объект SimpleChanges
. Если вы посмотрите на currentValue.offsetHeight
, высота - это ожидаемое значение (т. Е. Значение соответствует тому, что отображает родительский компонент)
Однако дочерний компонент отображает значение, отличное от ожидаемого.
Что еще более странно, если вы измените шаблон дочернего компонента на что-то вроде:
<div>
<p>Child: {{ display }}</p>
</div>
Просто добавив некоторый дополнительный контент в div, дочерний компонент теперь отображает ожидаемое значение (то есть значение соответствует тому, что родительский компонент отображается, и он соответствует значению в SimpleChanges)
Проще говоря, почему возникает эта разница?
В моей базе кода возникла проблема с использованием offsetHeight
где значение в SimpleChanges является точным, но значение, которое я пытаюсь сохранить в переменной экземпляра и использую в компоненте, является неточным. Этот плункер, вероятно, не эмулирует проблему, с которой я сталкиваюсь в моей кодовой базе, но, возможно, понимание причины / следствий того, что я описал выше, может помочь мне понять проблему, с которой я сталкиваюсь в своей кодовой базе.
Спасибо !