Einstellen des Datenattributs von Lenkerobjekten

Question

Ich benutze NodeJs mit Express und Lenker.

Ich erstellen ein Raster auf dem Server und senden das Objekt an den Client. Die Liste enthält Zellen mit zwei Eigenschaften, x Position und y Position.

Also gehe ich für diesen Code

$(document).ready(function() { 
 
    var cells = $(".cell"); // get all cells 
 
    
 
    $(cells).each(function(i, cell) { 
 
    var currentCell = $(cell); 
 
    var x = currentCell.data("xPos"); // get the xPos 
 
    var y = currentCell.data("yPos"); // get the yPos 
 
    
 
    currentCell.click(function() { // add a click event to each cell 
 
     console.log(x + " | " + y); 
 
    }); 
 
    
 
    }); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
{{#each map}} 
 
<div class="row"> 
 
    {{#each this}} 
 

 
    <!-- <p>{{this.x}}</p> prints out a correct value! --> 
 
    <!-- <p>{{this.y}}</p> prints out a correct value! --> 
 

 
    <div class="cell" data-xPos={{this.x}} data-yPos={{this.y}}></div> 
 
    {{/each}} 
 
</div> 
 
{{/each}}

Wenn auf eine Zelle, die Konsolenprotokolle klicken

undefined | undefined

Wie kann ich das Datenattribut einstellen? Ich möchte nur die Informationen an das Client-Skript übergeben, also ging ich für das Datenattribut.

Ein Beispiel DOM nach der Seite

Aufbau

Answer 1

das Datenattribut

data-xpos = {{}} this.x data-ypos = {{Dies sein muss, .y}}

So ist die vollständige HTML wäre

<div class="cell" data-xpos={{this.x}} data-ypos={{this.y}}></div> 

und die JS

var x = currentCell.data("xpos"); 
var y = currentCell.data("ypos");