打字稿错误类型' HTMLElement'中不存在属性。任何

时间:2018-06-13 04:21:28

标签: html typescript

我正在尝试使用javascript里面的打字稿创建一个表但是我收到了错误:

[ts] Property 'insertRow' does not exist on type 'HTMLInputElement'.
any

我生成表的代码是这样的:

  createTable(chart){
  var table = document.createElement("TABLE");    
  var row,header,cell1, cell2;
  var data = chart.options.data;

  table.style.border = "1px solid #000"; 
  header = table.createTHead();
  row = header.insertRow(0);    
  cell1 = row.insertCell(0);
  cell2 = row.insertCell(1);
  cell1.style.border = "1px solid #000"; 
  cell2.style.border = "1px solid #000"; 
  cell1.innerHTML = "<b>X-Value</b>"; 
  cell2.innerHTML = "<b>Y-Value</b>"; 

  for(var i = 0; i < data.length; i++){
    for(var j = 0; j< data[i].dataPoints.length; j++){
      row = table.insertRow(1);

      cell1 = row.insertCell(0);
      cell2 = row.insertCell(1);
      cell1.style.border = "1px solid #000"; 
      cell2.style.border = "1px solid #000"; 

      cell1.innerHTML = data[i].dataPoints[j].x;
      cell2.innerHTML = data[i].dataPoints[j].y; 
    }
  }    
  document.getElementById("chartContainer").appendChild(table);
}

我收到两个属性的错误createTHead()和insertRow()我在stackoverflow中跟着几个答案我用过这个:

(document.createElement("TABLE")) as HTMLInputElement;

(table.createTHead()) as HTMLBodyElement;
(table.createTHead()) as HTMLInputElement;

我尝试了以下这些事情,我不知道为什么会收到此错误:

1 个答案:

答案 0 :(得分:0)

我的解决方案的答案非常简单我需要指定我的表格是什么类型的元素。所以回答我的问题是:

  createTable(chart){
  var table = document.createElement("TABLE")  as HTMLTableElement;    
  var row,header,cell1, cell2;
  var data = chart.options.data;
  table.style.border = "1px solid #000"; 
  header = table.createTHead();
  row = header.insertRow(0);    
  cell1 = row.insertCell(0);
  cell2 = row.insertCell(1);
  cell1.style.border = "1px solid #000"; 
  cell2.style.border = "1px solid #000"; 
  cell1.innerHTML = "<b>X-Value</b>"; 
  cell2.innerHTML = "<b>Y-Value</b>"; 

  for(var i = 0; i < data.length; i++){
    for(var j = 0; j< data[i].dataPoints.length; j++){
      row = table.insertRow(1);
      cell1 = row.insertCell(0);
      cell2 = row.insertCell(1);
      cell1.style.border = "1px solid #000"; 
      cell2.style.border = "1px solid #000"; 

      cell1.innerHTML = data[i].dataPoints[j].x;
      cell2.innerHTML = data[i].dataPoints[j].y; 
    }
  }    
  document.getElementById("chartContainer").appendChild(table);
 }

所以我添加了HTMLTableElement,这是解决我的问题的方法。