使用Mustache.Js渲染简单数组 [英] Render simple array using Mustache.Js

查看:333
本文介绍了使用Mustache.Js渲染简单数组的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

具有如下所示的数组

var arrNames = ["Stackoverflow","StackExchange","Webmaster","Programmers"];

模板应如何与mustache.js javascript模板一起使用.我在下面尝试了但没有任何线索

how should a template look for working with mustache.js javascript template. I tried below but no clues

  • {{#}}{{key}}{{/}}

推荐答案

来自文档 :

当遍历字符串数组时,一个.可以用来引用列表中的当前项目.

When looping over an array of strings, a . can be used to refer to the current item in the list.

模板:

{{##火枪手}} * {{.}} {{/火枪手}}

{{#musketeers}} * {{.}} {{/musketeers}}

查看:

{ 火枪手":["Athos","Aramis","Porthos","D'Artagnan" }

{ "musketeers": ["Athos", "Aramis", "Porthos", "D'Artagnan"] }

输出:

  • 阿索斯
  • Aramis
  • Porthos
  • D'Artagnan
  • Athos
  • Aramis
  • Porthos
  • D'Artagnan

var tpl = document.getElementById('simple').innerHTML,
  view = {
    items: ['Stackoverflow', 'StackExchange', 'Webmaster', 'Programmers']
  };

document.getElementById('output').innerHTML = Mustache.to_html(tpl, view);

<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.js"></script>
<script type="template" id="simple">
  <h1>Array Values</h1>
  <ul>
    {{#items}}
    <li>{{.}}</li>
    {{/items}}
  </ul>
</script>

<div id="output"></div>

这篇关于使用Mustache.Js渲染简单数组的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆