☰

Angular2イベントはどのようなTypescriptタイプですか？質問する

tag-icon • tag-icon javascript typescript angular
Angular2イベントはどのようなTypescriptタイプですか？質問する

HTMLファイルに次のボタンがある場合

<button (click)="doSomething('testing', $event)">Do something</button>

また、対応するコンポーネントには、この機能があります

doSomething(testString: string, event){
    event.stopPropagation();
    console.log(testString + ': I am doing something');
}

入力に割り当てるべき適切な型はありますか$event？イベントパラメータ自体はオブジェクトですが、それを型オブジェクトに割り当てるとエラーが発生します。

プロパティ 'stopPropogation' はタイプ オブジェクトに存在しません

では、Typescript は$event入力をどのように考慮するのでしょうか?

ベストアンサー1

@AlexJ の提案どおり

渡したイベントは$eventDOM イベントなので、 をEventNameタイプとして使用できます。

あなたの場合、このイベントはMouseEvent、そしてドキュメントには次のように書かれている。

のマウスイベントインターフェースは、ユーザーがポインティングデバイス（マウスなど）を操作することで発生するイベントを表します。このインターフェースを使用する一般的なイベントには、次のようなものがあります。クリック、ダブルクリック、マウスアップ、マウスダウン。

これらすべてのケースでは、 が返されますMouseEvent。

別の例：このコードがある場合

<input type="text" (blur)="event($event)"

イベントが発生すると、FocusEvent。

非常に簡単にできます。コンソールにイベントをログすると、次のようなメッセージが表示されます。イベント名が表示されます。

FocusEvent {isTrusted: true, relatedTarget: null, view: Window, detail: 0, which: 0…}

既存のリストについては、いつでもドキュメントを参照してください。イベント。

編集

TypeScriptもチェックできますdom.generated.d.tsすべての型付けが移植されています。あなたの場合はstopPropagation()、Event、によって拡張されますMouseEvent。

おすすめ記事