Handlebar table 在每个 helper 问题中创建 3 个

Question

假设我有 3 个虚拟数组：

let dummyArray = [0,1,2,3,4];
let dummyArray2 = [0,1,2,3];
let dummyArray3 = [{data:'d1'},{data:'d2'}];

我想用这样的数组创建 table：

<table class="table">
        <thead>
            <tr>
                <th>col-0</th>
                <th>col-1</th>
                <th>col-2</th>
                <th>col-3</th>
                <th>col-4</th>
            </tr>
        </thead>
        <tbody>
            {{#each dummyArray}}
            <tr>
                <td>row</td>
                {{#each ../dummyArray2}}
                <td>
                    {{#each ../../dummyArray3}}
                        {{this.data}}
                    {{/each}}
                </td>
                {{/each}}
            </tr>
            {{/each}}
        </tbody>
    </table>

但我得到了意想不到的结果，table 中的一些单元格是空的。

演示：https://jsfiddle.net/PouyaAk/m7g31e8y/32/

Answer 1

使用 @root 解决了问题，见下文，但我仍然对为什么你的代码以这种方式工作很感兴趣 - 但我已经有一段时间没有使用 handelbarsjs

<table class="table">
            <thead>
                <tr>
                    <th>col-0</th>
                    <th>col-1</th>
                    <th>col-2</th>
                    <th>col-3</th>
                    <th>col-4</th>
                </tr>
            </thead>

            <tbody>
                {{#each dummyArray}}
                <tr>
                    <td>row</td>
                    {{#each @root.dummyArray2}}
                    <td>
                        {{#each @root.dummyArray3}}
                            {{this.data}}
                        {{/each}}
                    </td>
                    {{/each}}
                </tr>
                {{/each}}
            </tbody>

        </table>

编辑：下面的代码只填充以前空的单元格，将其余单元格留空 ...奇怪

<tbody>
                {{#each dummyArray}}
                <tr>
                    <td>row</td>
                    {{#each ../dummyArray2}}
                    <td>
                        {{#each ../dummyArray3}}
                            {{this.data}}
                        {{/each}}
                    </td>
                    {{/each}}
                </tr>
                {{/each}}
            </tbody>

Handlebar table 在每个 helper 问题中创建 3 个

Handlebar table createion with 3 inside each helper problem

handlebars.js