0

我刚开始使用 mustache.js，我有我的 json 字典、我的 html 模板和我的 mustache.js 启动代码来注入整个。我的 html-mustache 模板是这样的：

<script id="tpl" type="text/html">
    <div class="body">
        <p>{{口.zht}}</p>
        <p>{{口.sam.pyn}}</p>
        <p>{{口.sam.fra}}</p>
    </div>
</script>

在我的具有给定现有条目“口”的测试用例中，它可以工作（1）。但我注意到 Mustache 似乎旨在迭代所有JSON 条目。但是，我想处理一个小的焦点列表条目

var focusList = ['們','火山口','火'];

我想从我的较大（约 1000 个条目）JSON 字典中选择相应的数据。

如何根据我的 focusList 更改或制作变量 {{#口}} 和 {{/口}}，以便我可以使用正确的数据打印我的模板？

模板中是否有某些类型的变量，例如：

<script id="tpl" type="text/html">
    <div class="body">
        <p>{{{{entry}}.zht}}</p>
        <p>{{{{entry}}.sam.pyn}}</p>
        <p>{{{{entry}}.sam.fra}}</p>
    </div>
</script>

在 JS 中我添加：

var entry = focusList[Math.floor(Math.random() * focusList.length)]]

?

4

1 回答 1

2

解决方案：给定一个小的键列表，从较大的 JSON 数据中打印相关条目： 

//1. Suggest a smaller custom list of keys existing in the larger data. 2. Randomize.
var focusList = ['們','火山口','火'];
var randomKey = focusList[Math.floor(Math.random() * focusList.length)];
//3. variable + Template + variable. 4. printing.
var template = ('{{#'+ randomKey +'}}'+ $('#tpl').html() +'{{/'+randomKey+'}}'); // as {{#火}} ... {{/火}}
var output = Mustache.render(template, myBigJSON);
$('#main').append(output)

或者 1：您还可以使用 Object.keys ( 2 )获取整个条目列表，以从 WHOLE 列表中打印一个随机条目： 

//1. Get and create the list of all keys
var focusList = Object.keys(myBigJSON);

最后，您可以打乱给定的列表并系统地迭代打乱的列表以系统地打印每个项目，而不是随机化和循环可能会重复一些条目。

于 2013-02-06T09:12:31.177 回答