[解決済み】TypeScriptのEventTarget型にプロパティ'value'が存在しない。

質問

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)">

このコードでは、エラーが発生します。

プロパティ 'value' はタイプ 'EventTarget' に存在しません。

しかし console.log にはその値が存在します。 event.target .

解決方法は？

event.target はここにあります。 HTMLElement は、すべての HTML 要素の親ですが、プロパティ value . TypeScriptはこれを検知してエラーを投げます。キャスト event.target を適切な HTML 要素に変換し、それが HTMLInputElement がありますが、これは value プロパティを使用します。

(<HTMLInputElement>event.target).value

あたり 文書化 :

を入力します。 $event

上の例では $event として any のタイプになります。その分、コストはかかりますが、コードはシンプルになります。イベントオブジェクトのプロパティを明らかにし、愚かなミスを防ぐことができるような型情報はありません。

[...]

があります。 $event は、現在では特定の KeyboardEvent . すべての要素に value プロパティにキャストされます。 target を入力要素に設定します。

(中略)