Dust.js if значение в массиве

Question

У меня есть файл шаблона dust.js, в который я передаю 2 массива:

• 1 массив опций для выпадающего множественного выбора
• 1 массив выбранных опций

Как выбрать параметры в раскрывающемся меню в dust.js?

Вот пример:

Данные, которые я отправляю в шаблон

var selectOptions = [1,2,3,4,5,6,7,8,9,10,11,12,13];
var selectedValues = [3,7,9];

Шаблон

<select multiple>
    {#selectOptions}
        <option>{.}</option>
    {/selectOptions}
</select>

Как я могу использовать {selectedValues} для выбора этих опций?

Заранее спасибо за помощь.

Answer 1

Другое решение, которое сделает его более чистым для вашего шаблона dust.js, - объединить оба списка в новый список объектов.

Итак, используя ваш предыдущий пример данных:

var selectOptions = [1,2,3,4,5,6,7,8,9,10,11,12,13];
var selectedValues = [3,7,9];
var options = [];
for(var i=0;i<selectOptions.length;i++){
    var item = selectOptions[i];
    // Option object containing selected value + selected info
    var option = { value : item, selected : selectedValues.indexOf(item) > -1 };
    options.push(option);
}

Ваш шаблон dust.js теперь будет выглядеть так:

<select multiple>
{#options}
    <option {?selected}selected="true"{/selected}>{value}</option>
{/options}
</select>

Answer 2

Добавить в другой цикл, чтобы просмотреть выбранные параметры

<select multiple>
    {#selectOptions}
        <option
            {#selectedValues val=.}
                {@eq key="{val}" value="{.}"}selected="true"{/eq}
            {/selectedValues}
        >{.}</option>
    {/selectOptions}
</select>

Обратите внимание, что я использую Dust Helpers от Linkedin, чтобы обеспечить сравнение на равенство.

Answer 3

Не совсем связано с этим конкретным вопросом, но может быть кому-то полезно. Вы можете создать глобального помощника, который делает именно это:

_.extend dust.helpers,

  contains: (chunk, context, bodies, params) ->
    if _.contains params.array, params.key
      chunk = bodies.block(chunk, context)

    chunk

Я использовал CoffeeScript и Underscore.js, но его легко перевести на обычный Javascript.

Использование:

// options = ["foo", "bar"]
{@contains array=options key="bar"}
  Bar is an option.
{/contains}

Существует также плагин, гораздо более обширный, с той же функциональностью в dustjs-helpers-extra.

Подробнее о том, как создавать глобальных помощников.