javascript - 尘埃js动态@eq条件

这看起来很简单，但我只是想不出如何动态更改@eq条件。该示例显示了默认渲染，即卷曲，但我需要做的是接受用户输入，例如单击一个按钮并将其更改为larry或moe。

见我的jsfiddle http://jsfiddle.net/bodyrock/a7nmurnr/4/

从我阅读的内容看来，我必须使用以下技术之一：
-将base.push放入上下文
-makebase
-部分
-内联参数
-变量查找

<script type="javascript">
$(document).ready(function () {
var data = {
    "title": "Famous People",
    "names" : [{ "name": "Larry", "props":[{"name":"height","value":"5.8"},{"name":"weight","value":"160"}] },{ "name": "Curly", "props":[{"name":"height","value":"5.9"},{"name":"weight","value":"200"}]},{ "name": "Moe", "props":[{"name":"height","value":"5.8"},{"name":"weight","value":"160"}]}]
}

var source   = $("#entry-template").html();
var compiled = dust.compile(source, "intro");
dust.loadSource(compiled);

dust.render("intro", data, function(err, out) {
    $("#output").html(out);
});
});
</script>

<script id="entry-template">
{title}
<ul>
{#names}
    {@eq key=name value="Curly"}
    <li>
      {name}
      <ul><li>Weight: {#props}{@eq key=name value="weight"}{value}{/eq} {/props}</li></ul>
    </li>
    {/eq}
{/names}
</ul>
</script>
<input type="button" value="moe" onclick="alert('change to moe');"><input type="button" value="larry" onclick="alert('change to larry');"><input type="button" value="curly" onclick="alert('change to curly');">
<div id="output"></div>

最佳答案

您只需要使用新的上下文重新呈现模板，该上下文包含有关您要显示的人的信息。

JSFiddle

$('input').on('click', function() {
    var ctx = dust.makeBase({ currentName: $(this).val() }).push(data);
    dust.render("intro", ctx, function(err, out) {
        $("#output").html(out);
    });
}).first().click();

和

{#names}
    {@eq key=name value=currentName}
    <li>
      {name}
      <ul><li>Weight: {#props}{@eq key=name value="weight"}{value}{/eq}{/props}</li></ul>
    </li>
    {/eq}
{/names}

关于javascript - 尘埃js动态@eq条件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27757072/