Использование ручек для динамического раскрашивания - PullRequest
Новая
       3

Использование ручек для динамического раскрашивания

1 голос
/ 26 мая 2020

Я просматриваю объект и показываю результирующую таблицу с помощью ручек.

Если определенное число больше 50, я хочу стилизовать цвет номер один, а если он меньше 50, я хочу стилизовать его другим цветом.

Я новичок в рулях, поэтому мне сложно понять, как бы я сделал logi c. Я искал пользовательских помощников, но не знаю, как мне написать нужный HTML / CSS.

Спасибо!

1 Ответ

0 голосов
/ 26 мая 2020

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

Расширение официального образца руля (https://handlebarsjs.com/guide/#installation): 

<!-- index.html -->
<html>
<body>
<div id="root"></div>
</body>
<!-- Include Handlebars from a CDN -->
<script src="https://cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script>
<script>
  // compile the template
  var template = Handlebars.compile("<div style='color: {{textColor}}''>Handlebars <b>{{doesWhat}}</b>");

  var amount = 55;
  var color = amount > 50 ? "red" : "green"

  document.getElementById("root").innerHTML = template({ doesWhat: "rocks!", textColor: color });
</script>
</html>
...