Hallo sahabat dumenity berjumpa lagi dalam tutorial kursuswebdesign, pada tutorial kali ini saya akan membahas tentang Menggunakan Controllers dalam AngularJS. Aplikasi AngularJS terutama mengandalkan Controllers untuk mengendalikan arus data dalam aplikasi. Controllers didefinisikan dengan menggunakan perintah ng-controller. Controllers adalah objek JavaScript yang berisi atribut / properti dan fungsinya. Setiap Controllers menerima $ scope sebagai parameter yang mengacu pada aplikasi / modul kontroler yang harus dikontrol.

 

Di sini kita telah mendeklarasikan controller studentController menggunakan perintah ng-controller. Sebagai langkah selanjutnya kita akan mendefinisikan studentController sebagai berikut :

 

Oke saya akan menjelaskan tentang script di atas:

  • studentController didefinisikan sebagai objek JavaScript dengan $ scope sebagai argumen.
  • $ scope mengacu pada aplikasi yang menggunakan objek studentController.
  • $ scope.student adalah milik objek studentController.
  • firstName dan lastName adalah dua properti dari $ scope.student object. Kami telah melewati nilai default untuk mereka.
  • fullName adalah fungsi dari $ scope.student object yang tugasnya mengembalikan nama gabungan.
  • Dalam fungsi fullName kita mendapatkan objek siswa dan kemudian mengembalikan nama gabungan.
  • Sebagai catatan, kita juga bisa menentukan objek controller dalam file JS yang terpisah dan rujuk file itu di halaman html.

Sekarang kita bisa menggunakan properti siswa studentController menggunakan ng-model atau menggunakan ungkapan sebagai berikut:

Penjelasan:

  • saya telah membatasi student.firstName dan student.lastname ke dua kotak masukan.
  • saya telah membatasi student.fullName () ke HTML.
  • Sekarang setiap kali Anda mengetik sesuatu di nama depan dan nama belakang kotak input, Anda dapat melihat nama lengkap mendapatkan update secara otomatis.

Contoh lengkapnya:

Oke dari script di atas maka akan menghasilkan output seperti di bawah ini:

Menggunakan Controllers dalam AngularJS

Oke itulah tadi pembahasan saya tentang Menggunakan Controllers dalam AngularJS semoga dapat bermanfaat.

WhatsApp chat