Cách lấy @index của lồng nhau #each trong thiên thạch

Question

Tôi có một mảng 10x10 đại diện cho 10 hàng với 10 ô mỗi. Tôi muốn vẽ một lưới và thiết lập background-color mỗi tế bào theo giá trị trong mảng:

một giá trị 0 sẽ có màu trắng và một giá trị 1 sẽ có màu đen

tôi đã thiết lập CSS này :

.cell{ 
    height: 20px; 
    width: 20px; 
    float: left; 
    margin: 0; 
    padding: 0; 
} 

.cell.live{ 
    background-color: black; 
} 

.cell.dead { 
    background-color: white; 
} 

tôi tạo ra một helper rằng sẽ trở lại 'sống' hay 'chết' theo giá trị trong mảng theo 2 đối số: x và y

đây là các mã:

Template.grid.helpers({ 
    cellState: function(x, y) { 
     if(screenArray[x][y] === 1){ 
     return 'live'; 
     } 
     else { 
     return 'dead'; 
     } 
    } 
    }); 

vấn đề của tôi là tôi không biết làm thế nào để có được những @index của cả hai #each tôi vòng

đây là mẫu của tôi, tôi không thể tìm ra giải pháp cho ?????

<template name="grid"> 
    <div class="gridWrapper"> 
    {{#each row in rows}} 
    <div class="row"> 
     {{#each cell in row}} 
     <div class="cell {{cellState @index ?????}}">{{this}}</div> 
     {{/each}} 
    </div> 
    {{/each}} 
</div> 
</template> 

Answer 1

Bạn cần phải sử dụng let để nắm bắt các chỉ số, như:

{{#let rowIndex=@index}} 
    {{#each cell in row}} 
     <div class="cell {{cellState @index rowIndex}}">{{this}}</div> 
    {{/each}} 
{{/let}}