TypeScript 中的 EventTarget 类型不存在属性“值”

Question

所以下面的代码在 Angular 4 中，我不知道为什么它不能按预期的方式工作。

这是我的处理程序的片段：

 onUpdatingServerName(event: Event) {
  console.log(event);
  this.newserverName = event.target.value; //this wont work
}

HTML 元素：

 <input type="text" class="form-control" (input)="onUpdatingServerName($event)">

代码给了我错误：

“EventTarget”类型上不存在属性“值”。

但正如在 console.log 中可以看到的那样，该值确实存在于 event.target 上。

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

Answer 1

event.target 这是一个 HTMLElement 它是所有 HTML 元素的父元素，但不保证具有属性 value 。 TypeScript 检测到这一点并抛出错误。将 event.target 转换为适当的 HTML 元素，以确保它是 HTMLInputElement 它确实具有 value 属性：

 (event.target as HTMLInputElement).value

根据 文档：

键入 $event

上面的示例将 $event 转换为 any 类型。这以某种代价简化了代码。没有类型信息可以揭示事件对象的属性并防止愚蠢的错误。

[…]

$event 现在是特定的 KeyboardEvent 。 并非所有元素都具有 value 属性，因此它将 target 强制转换为输入元素。

（强调我的）

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

Answer 2

请试试这个

<input type = 'text' [value] = 'value' (input) = 'data = $any($event.target).value'>

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