Auto refresh adalah refresh atau melakukan loading baru di halaman browser secara otomatis dalam waktu yang sudah ditentukan. Dimana ketika kita membuka satu file yang sama di dua browser dan kita melakukan input data di salah satu browser maka akan secara otomatis data yang tampil akan terupdate atau diperbarui di semua browser, tidak hanya di browser yang kita lakukan input data saja. Nah kali ini akan saya bahas pada artikel tentang Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs.

Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs langkah pertama yang harus dilakukan adalah kita buat struktur htmlnya seperti berikut ini ya teman-teman.

Jika dilihat dari script di atas, saya membuat sebuah form input untuk input data dan tag ul li untuk menampilkan datanya.

Langkah selanjutnya teman-teman buat controller, dimana didalamnya terdapat fungsi tambahData() untuk tambah data dan getData() untuk menampilkan data.

Untuk fungsi tambahData() dan getData() saya anggap teman-teman sudah mengerti ya. Karena pernah saya bahas juga pada artikel sebelumnya tentang Cara Input Data Menggunakan AngularJs Part1. kita akan fokus ke script di bawah ini yang membuat auto refresh pada tampilan data di browser.

Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs

Dimana disini saya buat fungsi dengan menggunakan $interval dari angularjs dan didalamnya berisi fungsi getData() dengan waktu 1000 milisecond. Hal tersebut sama saja saya membuat fungsi yang akan dilakukan terus menerus dengan waktu tertentu yang sudah ditentukan. Dan fungsi interval itu berisi fungsi getData() yang akan selalu di refresh.

Berikut ini adalah tampilan di dua halaman browser.

Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs

Dan berikut ini adalah gambar script dari add.php untuk input data dan data.php untuk tampil data.

Add.php

Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs

Data.php

Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs

Demikian artikel tentang Cara Membuat Auto Resfresh Dengan Menggunakan Angularjs. Semoga dapat bermanfaat dan selamat mencoba.