Может ли усы перебирать массив верхнего уровня?

Мой объект выглядит следующим образом:

['foo','bar','baz']

И я хочу использовать шаблон усы, чтобы создать из него что-то вроде этого:

"<ul><li>foo</li><li>bar</li><li>baz</li></ul>"

Но как? Должен ли я сначала перенести его на нечто подобное?

{list:['foo','bar','baz']}

Ответ 1

Вы можете сделать это вот так:

Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>', ['foo','bar','baz']);

Он также работает для таких вещей...

var obj = [{name: 'foo'}, {name: 'bar'}];
var tmp = '<ul>{{#.}}<li>{{name}}</li>{{/.}}</ul>';
Mustache.render(tmp, obj);

Ответ 2

У меня была такая же проблема сегодня утром, и после небольшого эксперимента я обнаружил, что вы можете использовать {{.}} для обращения к текущему элементу массива:

<ul>
  {{#yourList}}
  <li>{{.}}</li>
  {{/yourList}}
</ul>

Ответ 3

Основываясь на ответе @danjordan, это сделает то, что вы хотите:

Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>',['foo','bar','baz']);

возвращение:

<ul><li>foo</li><li>bar</li><li>baz</li></ul>

Ответ 4

Ниже приведены примеры визуализации многомерного массива в шаблоне:

Пример 1

'use strict';

var Mustache = require('mustache');

var view = {test: 'div content', multiple : ['foo', 'bar'], multiple_2 : ['hello', 'world']};
var template = '<div>{{test}}</div><ul>{{#multiple}}<li>{{.}}</li>{{/multiple}}</ul><ul>{{#multiple_2}}<li>{{.}}</li>{{/multiple_2}}</ul>';

var output = Mustache.render(template, view);

console.log(output);

Пример 2

'use strict';

var Mustache = require('mustache');

var view = {test: 'div content', multiple : [{name: 'foo', gender: 'male'}, {name: 'bar', gender: 'female'}], multiple_2 : [{text: 'Hello', append: '**', prepend: '**'}, {text: 'World', append: '**', prepend: '**'}]};
var template = '<div>{{test}}</div><ul>{{#multiple}}<li>Hello my name is {{name}}. And I am {{gender}}</li>{{/multiple}}</ul><ul>{{#multiple_2}}<li>{{prepend}}_{{text}}_{{append}}</li>{{/multiple_2}}</ul>';

var output = Mustache.render(template, view);

console.log(output);

Для тестового запуска сохраните выше примеры в файле с именем "test.js", выполните следующую команду в командной строке

nodejs test.js

Ответ 5

Я не думаю, что усы могут это сделать! (как ни странно) Вы можете перебирать список объектов, а затем обращаться к атрибутам каждого объекта, но вы не можете перебирать простой список значений!

Итак, вы должны преобразовать свой список в:

[ {"value":"foo"},{"value":"bar"},{"value":"baz"} ]

а затем ваш шаблон будет выглядеть следующим образом:

<ul>
  {{#the_list}}
  <li>{{value}}</li>
  {{/the_list}}
</ul>

Для меня это кажется серьезной проблемой для Mustache - любая система шаблонов должна иметь возможность перебирать список простых значений!