Hallo sahabat dumenity berjumpa lagi dalam tutorial kursuswebdesign, pada tutorial kali ini saya akan membahas tentang Fungsi Views pada AngularJS. Bahasa pememrograman  AngularJS mendukung Aplikasi satu halaman melalui beberapa tampilan pada satu halaman. Untuk melakukan ini AngularJS telah menyediakan arahan ng-view dan ng-template dan $routeProvider service.

ng-view  adalah tag ng-view hanya membuat tempat pemegang tempat tampilan yang sesuai (tampilan html atau ng-template) dapat ditempatkan berdasarkan konfigurasi.

Contoh Pemakaian:

Tentukan div dengan ng-view dalam modul utama.

ng-template, Petunjuk ng-template digunakan untuk membuat tampilan html menggunakan tag script. Ini berisi atribut “id” yang digunakan oleh $ routeProvider untuk memetakan tampilan dengan controller.

Contoh pemakaian:

Tentukan blok script dengan tipe ng-template dalam modul utama.

$routeProvider, $routeProvider adalah layanan utama yang mengatur konfigurasi url, memetakannya dengan halaman html atau ng-template yang sesuai, dan melampirkan controller dengan sama.

Contoh Pemakaian

Tentukan blok script dengan modul utama dan atur konfigurasi routing.

Berikut adalah poin penting yang harus diperhatikan dalam contoh di atas:

  •   $ routeProvider didefinisikan sebagai fungsi di bawah konfigurasi modul mainApp dengan menggunakan kunci sebagai ‘$ routeProvider’.
  •   $ routeProvider.when mendefinisikan url “/ addStudent” yang kemudian dipetakan ke “addStudent.htm”. addStudent.htm harus hadir di jalur yang sama dengan halaman html utama. Jika halaman htm tidak didefinisikan maka ng-template akan digunakan dengan id = “addStudent.htm”. Kami telah menggunakan ng-template.
  •  “otherwise” digunakan untuk mengatur tampilan default.
  •   “controller” digunakan untuk mengatur controller yang sesuai untuk tampilan.

Contoh berikut akan menampilkan semua arahan yang disebutkan di atas. buat file dengan nama bebas.

testAngularJS.htm

Oke untuk melihat hasilnya silahkan copy paste script di atas lalu buka pada browsernya. Oke itulah tadi pembahasan saya tentang Fungsi Views pada AngularJS semoga bermanfaat.