Динамически изменять размер узла шаблона node-red-dashboard

Как лучше всего задать размер узла при использовании узла шаблона и динамическом добавлении содержимого? Например, у меня есть div с динамическим размером, который я передаю msg.payload.divInfo:

<div>
    {{msg.payload.divInfo}}
</div>

Поскольку у div нет атрибута высоты, я вижу только одну строку информации и должен прокручивать ее. Если я установлю высоту div статически:

<div style = "height: 130px;">
    {{msg.payload.divInfo}}
</div>

Он показывает весь контент. Если я попытаюсь установить высоту div с помощью:

<div style = "height: {{msg.payload.divHeight}}px;">
    {{msg.payload.divInfo}}
</div>

Я все еще вижу только одну строку.

Div не может быть статической высоты.

Вы решили эту проблему?

libzz 18.04.2019 06:40
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
CSS: FlexBox
CSS: FlexBox
Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.
2
1
980
1

Ответы 1

Как насчет

<div style = "height:auto;">
</div>

или

<div style = "height:auto; overflow:auto">
</div>

Родительский div, управляемый node-red, устанавливает размер div на определенную высоту, хотя я оставил для размера узла значение auto. Похоже, что он не выполняет расчет с использованием msg.payload.divHeight до тех пор, пока не определит размер родительского div. На данный момент я использую уродливый обходной путь, используя .parent.style.height = "auto", но я просто хочу посмотреть, есть ли что-то, чего мне не хватает при настройке узла шаблона.

John Smith 15.03.2019 18:38

Прошло много времени, но я столкнулся с той же проблемой, и было бы очень полезно, если бы вы могли показать, как вы добавили это в шаблон.

karthik110885 22.05.2021 21:13

Другие вопросы по теме