Mustache.js渲染矩阵

时间:2018-04-25 13:28:23

标签: javascript matrix mustache

如何在Mustache.js中渲染矩阵?

不幸的是,我无法改变Matrix的结构。

以下矩阵:

    var DiskMakerModels = [
        [ "Blue", "WD" ],
        [ "Green", "WD" ],
        [ "Black", "WD" ],
        [ "Purple", "WD" ],
        [ "Red", "WD" ],
        [ "Red Pro", "WD" ],
        [ "Gold", "WD" ],
        [ "Barracuda", "Seagate" ],
        [ "Firecuda", "Seagate" ],
        [ "Ironwolf", "Seagate" ],
        [ "Skyhawk", "Seagate" ]
    ];

需要呈现到以下模板中:

<script id="tableTemplate" type="x-tmpl-mustache">
    {{#rows}}
        <div class="list-item noPrint" dir="ltr">
            <input type="readonly" class="rowNum" value="1">
            <button onclick="addTableElement(this)">+</button>
            <input type="text" class="txtInp" value="{{.[0]}}">
            <input type="text" class="txtInp" value="{{.[1]}}">
            <button onClick="removeTableElement(this);">-</button>
        </div>
    {{/rows}}
</script>

其中:{{.[0]}}{{.[1]}}应该是特定行的第一项和第二项。

1 个答案:

答案 0 :(得分:0)

我相信以下调整应该可以解决问题:

<script id="tableTemplate" type="x-tmpl-mustache">
    {{#rows}}
        <div class="list-item noPrint" dir="ltr">
            <input type="readonly" class="rowNum" value="1">
            <button onclick="addTableElement(this)">+</button>
            {{#.}}
                <input type="text" class="txtInp" value="{{.}}">
            {{/.}}
            <button onClick="removeTableElement(this);">-</button>
        </div>
    {{/rows}}
</script>

我已经对它进行了测试,它似乎有效,但是我运行了一个PHP版的小胡子,所以你的里程可能会有所不同。