Textarea 的“HTMLElement”类型上不存在属性“value”-Angular

Question

使用 Angular 4（打字稿），我有以下 HTML 代码：

  <div *ngIf="dataService.selected_markers.length == 0" id="tsnPasteContainer">
      <form style="width: 100%; height: 100%">
        <textarea id="tsn_list" style="width: 100%; height: 100%" type="text" name="tsn_list" placeholder="e.g. 2001311,2425302,2153542,2435974"></textarea>
      </form>
    </div>

我正在尝试使用以下方法获取用户在文本区域中输入的数据：

 public parseTSNs(){
    let tsnString = document.getElementById("tsn_list").value;
    console.log("User inputted string: " + tsnString);
}

该函数由按钮调用。

由于以下原因，代码未编译：

 Property 'value' does not exist on type 'HTMLElement'

这应该是一个简单的功能。我究竟做错了什么？ W3schools“从文本区域获取值”将“.value”显示为所需函数！

原文由 dandev91 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您只需要断言元素的类型是 HTMLTextAreaElement 。因为 document.getElementById 返回 HTMLElement 并且并非所有 html 元素都具有 value 属性：

 let tsnString = (document.getElementById("tsn_list") as HTMLTextAreaElement).value;

但是当你使用 Angular 时，你可能应该使用数据绑定而不是自己查询值

原文由 Saravana 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

在表格中设置单元格的值时，我遇到了类似的问题。

我按如下方式添加数据：

 document.getElementById("table_id").rows[0].cells[0].innerHTML = "data_to_be_added";

我收到以下错误：

错误 TS2339：属性“行”在类型“HTMLElement”上不存在

类型“HTMLElement”上不存在属性“单元格”

所以我添加了以下标签，错误得到解决。

 (document.getElementById("table_id") as any).rows[0].cells[0].innerHTML = "data_to_be_added";

在这里，您明确地将变量的类型更改为任何类型。

原文由 pppai 发布，翻译遵循 CC BY-SA 4.0 许可协议