Используйте одну переменную для определения тега усов

Есть ли возможность установить усатый тег с определенными переменными? Что-то вроде этого:

Json

{
    "color_set_01": [
        "white", "black"
        ],
    "color_set_02": [
        "green", "red"
    ]
}

JavaScript

var color = 'color_set_' + options.number;

$.getJSON('json/data.json', function(data) {
    var template = "<ul>{{color}}<li class="{{.}}"></li>{{/color}}</ul>";
    var html = Mustache.to_html(template, data);
    colors_panel.html(html);
});

и желаемый результат, если это color_set_01 Арай

<div class="colors_panel">
    <ul>
      <li class="white">
      <li class="black">
    </ul>
</div>

1 ответ

Решение

Хорошо, после быстрого просмотра http://coenraets.org/blog/2011/12/tutorial-html-templates-with-mustache-js/, я думаю, что это будет работать:

var template = "<ul>{{#"+color+"}}<li class=\"{{.}}\"></li>{{/"+color+"}}</ul>";

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

Это также предполагает, что ваш JSON должен выглядеть так:

{
    "color_set_01": [
        "white", "black"
    ],
    "color_set_02": [
        "green", "yellow"
    ]
}

Если есть больше чем color_setв вашем JSON, тогда вам придется показать, что родители color_set_01 до вершины для меня, чтобы помочь дальше.

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