AngularJS Events
AngularJS menyediakan banyak cara untuk menangani peristiwa (events) di dalam aplikasi web. Beberapa cara utama untuk menangani peristiwa di AngularJS termasuk:
1. ng-click
Menggunakan directive ng-click untuk menangani peristiwa klik pada elemen HTML.
Contoh:
htmlCopy code
<button ng-click="myFunction()">Klik saya</button>
2. ng-change
Directive ng-change digunakan untuk menangani perubahan nilai pada elemen input, seperti input tipe teks atau elemen select.
Contoh:
htmlCopy code
<input type="text" ng-model="myValue" ng-change="valueChanged()">
3. ng-submit
Untuk menangani pengiriman formulir, digunakan directive ng-submit pada elemen form.
Contoh:
htmlCopy code
<form ng-submit="submitForm()">
<button type="submit">Kirim</button>
</form>
4. ng-keyup/ng-keydown/ng-keypress
Directive seperti ng-keyup, ng-keydown, dan ng-keypress memungkinkan penanganan peristiwa ketika pengguna menekan atau melepaskan tombol pada keyboard.
Contoh:
htmlCopy code
<input type="text" ng-keyup="keyUpHandler($event)">
5. ng-mouseover/ng-mouseleave/ng-mouseenter/ng-mouseout
Untuk menangani peristiwa yang terjadi ketika pengguna melakukan interaksi dengan mouse, seperti ng-mouseover untuk saat mouse masuk ke elemen, ng-mouseleave saat mouse keluar, ng-mouseenter untuk saat mouse memasuki elemen, dan ng-mouseout untuk saat mouse keluar dari elemen.
Contoh:
htmlCopy code
<div ng-mouseover="mouseOverHandler()" ng-mouseleave="mouseLeaveHandler()">
Hover me!
</div>
6. $event Object
Anda juga dapat menggunakan $event object untuk menangani informasi spesifik tentang peristiwa yang terjadi, seperti posisi mouse, keycode, dll.
Contoh:
htmlCopy code
<button ng-click="handleClick($event)">Klik saya</button>
Ini adalah beberapa cara utama untuk menangani peristiwa di dalam AngularJS. Dengan menggunakan directive khusus, Anda dapat dengan mudah menambahkan logika yang relevan untuk berbagai peristiwa yang terjadi dalam aplikasi web Anda.