如何使用输入值（如input.value == 1）在棋盘中移动元素（如棋盘）;提升（）;并获得currentPositon（）

Question

我无法创建一个4/4 html表，我可以放置一个元素并使用输入值移动它。假设，如果input.value == 1然后向上移动，input.value == 2则moveDown，input.value == 5然后获取当前位置

Answer 1

想要这样的东西？ ：

elementPos = {
  row: 2,
  column: 2
};

tableRows: number = 4;
tableColumns: number = 4;

ngOnInit() {
  this.refreshTable();
}

refreshTable() {
  tableHTML = '<table><tbody>';
  for(let i=0;i<this.tableRows;i++) {
    tableHTML += '<tr>';
    for(let j=0;j<this.tableColumns;j++) {
      if (this.elementPos.row === i && this.elementPos.column === j) {
        tableHTML += '<td><div>My Element</div></td>';
      } else {
        tableHTML += '<td></td>';
      }
    }
    tableHTML += '</tr>';
  }

  document.querySelector('#myTableDiv').innerHTML = tableHTML;
}

updateElePosOnInput(val) {
  switch(val) {
    case 1:
      this.elementPos.row -= 1;
      break;
    case 2:
      this.elementPos.row += 1;
      break;
    default:
      this.elementPos.row = 2;
      this.elementPos.column = 2;
  };
  this.refreshTable();
}