Jenis Ketikan apa adalah acara Angular2

Jika saya memiliki tombol berikut dalam file html

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

Juga, dalam komponen yang sesuai, saya memiliki fungsi ini

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

Apakah ada tipe yang tepat yang harus diberikan ke $eventinput? Parameter event itu sendiri adalah sebuah objek, TAPI jika saya menetapkannya ke objek tipe, saya mendapatkan kesalahan

Properti 'stopPropogation' tidak ada pada objek tipe

Jadi, apa yang dianggap $eventmasukan oleh Typecript ?

Seperti yang disarankan oleh @AlexJ

Peristiwa yang Anda lewati $eventadalah peristiwa DOM, oleh karena itu Anda dapat menggunakan EventNamesebagai tipe.

Dalam kasus Anda, acara ini adalah MouseEvent, dan dokumen mengatakan, mengutip

The MouseEvent antarmuka merupakan peristiwa yang terjadi karena pengguna berinteraksi dengan perangkat penunjuk (seperti mouse). Peristiwa umum yang menggunakan antarmuka ini termasuk klik, dblclick, mouseup, mousedown .

Dalam semua kasus tersebut, Anda akan mendapatkan file MouseEvent.

Contoh lain: jika Anda memiliki kode ini

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

Saat peristiwa dipicu, Anda akan mendapatkan file FocusEvent.

Jadi Anda dapat melakukannya dengan sangat sederhana, konsol mencatat acara tersebut dan Anda akan melihat pesan yang mirip dengan pesan ini yang akan kami beri nama acara

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

Anda selalu dapat mengunjungi dokumen untuk melihat daftar Acara yang ada .

Sunting

Anda juga dapat memeriksa TypeScript dom.generated.d.tsdengan semua pengetikan porting. Dalam kasus Anda stopPropagation()adalah bagian dari Event, diperpanjang oleh MouseEvent.

Beberapa peristiwa yang umum digunakan dan nama yang terkait ( MouseEvent , FocusEvent , TouchEvent , DragEvent , KeyboardEvent ):

| MouseEvent | FocusEvent |  TouchEvent | DragEvent | KeyboardEvent |
|:----------:|:----------:|:-----------:|:---------:|:-------------:|
|    click   |    focus   |  touchstart |    drag   |    keypress   |
|   mouseup  |    blur    |  touchmove  |    drop   |     keyup     |
| mouseleave |   focusin  | touchcancel |  dragend  |    keydown    |
|  mouseover |  focusout  |   touchend  |  dragover |               |

Generik Acara dikaitkan ke:

• Menutup
• perubahan
• tidak valid
• bermain
• reset
• gulir
• Pilih
• Kirimkan
• beralih
• menunggu

Jika Anda menggali di repositori Typecript , dom.generated.d.ts menyediakan antarmuka peristiwa global (kredit diberikan ke jawaban Eric ) di mana Anda dapat menemukan semua pemetaan pengendali peristiwa di baris 5725 :

interface GlobalEventHandlersEventMap {
  "abort": UIEvent;
  "animationcancel": AnimationEvent;
  "animationend": AnimationEvent;
  "animationiteration": AnimationEvent;
  "animationstart": AnimationEvent;
  "auxclick": MouseEvent;
  "blur": FocusEvent;
  "cancel": Event;
  "canplay": Event;
  "canplaythrough": Event;
  "change": Event;
  "click": MouseEvent;
  "close": Event;
  "contextmenu": MouseEvent;
  "cuechange": Event;
  "dblclick": MouseEvent;
  "drag": DragEvent;
  "dragend": DragEvent;
  "dragenter": DragEvent;
  "dragexit": Event;
  "dragleave": DragEvent;
  "dragover": DragEvent;
  "dragstart": DragEvent;
  "drop": DragEvent;
  "durationchange": Event;
  "emptied": Event;
  "ended": Event;
  "error": ErrorEvent;
  "focus": FocusEvent;
  "focusin": FocusEvent;
  "focusout": FocusEvent;
  "gotpointercapture": PointerEvent;
  "input": Event;
  "invalid": Event;
  "keydown": KeyboardEvent;
  "keypress": KeyboardEvent;
  "keyup": KeyboardEvent;
  "load": Event;
  "loadeddata": Event;
  "loadedmetadata": Event;
  "loadend": ProgressEvent;
  "loadstart": Event;
  "lostpointercapture": PointerEvent;
  "mousedown": MouseEvent;
  "mouseenter": MouseEvent;
  "mouseleave": MouseEvent;
  "mousemove": MouseEvent;
  "mouseout": MouseEvent;
  "mouseover": MouseEvent;
  "mouseup": MouseEvent;
  "pause": Event;
  "play": Event;
  "playing": Event;
  "pointercancel": PointerEvent;
  "pointerdown": PointerEvent;
  "pointerenter": PointerEvent;
  "pointerleave": PointerEvent;
  "pointermove": PointerEvent;
  "pointerout": PointerEvent;
  "pointerover": PointerEvent;
  "pointerup": PointerEvent;
  "progress": ProgressEvent;
  "ratechange": Event;
  "reset": Event;
  "resize": UIEvent;
  "scroll": Event;
  "securitypolicyviolation": SecurityPolicyViolationEvent;
  "seeked": Event;
  "seeking": Event;
  "select": Event;
  "selectionchange": Event;
  "selectstart": Event;
  "stalled": Event;
  "submit": Event;
  "suspend": Event;
  "timeupdate": Event;
  "toggle": Event;
  "touchcancel": TouchEvent;
  "touchend": TouchEvent;
  "touchmove": TouchEvent;
  "touchstart": TouchEvent;
  "transitioncancel": TransitionEvent;
  "transitionend": TransitionEvent;
  "transitionrun": TransitionEvent;
  "transitionstart": TransitionEvent;
  "volumechange": Event;
  "waiting": Event;
  "wheel": WheelEvent;
}

Menurut official eventadalah tipe Object, juga dalam kasus saya ketika saya mengetikkan eventke Objek itu tidak menimbulkan kesalahan apa pun, tetapi setelah membaca dokumentasi angular2 yang ditemukan eventadalah tipe EventEmittersehingga Anda dapat mengetikkan kasta acara Anda ke dalamEventEmitter

lihat di sini adalah plunkr untuk http://plnkr.co/edit/8HRA3bM0NxXrzBAjWYXc yang sama?p=preview

untuk info lebih lanjut lihat di sini https://angular.io/docs/ts/latest/guide/template-syntax.html#!#event-binding