Cara terbaik untuk melihat kehebatan Aplikasi AngularJS adalah dengan membuat aplikasi asas pertama "Hello World" di Angular.JS.
Terdapat banyak persekitaran pembangunan bersepadu yang boleh anda gunakan untuk pengembangan AngularJS, beberapa yang popular disebutkan di bawah. Dalam contoh kami, kami menggunakan Webstorm sebagai IDE kami.
- Ribut web
- Teks Luhur
- Gerhana AngularJS
- Studio Visual
Helo dunia, AngularJS
Contoh di bawah menunjukkan kaedah termudah untuk membuat aplikasi "Hello world" pertama anda di AngularJS.
Guru99 {{message}}
Penjelasan Kod:
- Kata kunci " ng-app " digunakan untuk menunjukkan bahawa aplikasi ini harus dianggap sebagai aplikasi js sudut. Sebarang nama boleh diberikan untuk aplikasi ini.
- Pengawal adalah apa yang digunakan untuk memegang logik perniagaan. Dalam tag h1, kami ingin mengakses pengawal, yang akan mempunyai logik untuk memaparkan "HelloWorld", jadi kami boleh katakan, dalam tag ini kami ingin mengakses pengawal bernama "HelloWorldCtrl".
- Kami menggunakan pemboleh ubah anggota yang disebut "mesej" yang tidak lain adalah tempat letak untuk memaparkan mesej "Hello World".
- "Tag skrip" digunakan untuk merujuk skrip angular.js yang mempunyai semua fungsi yang diperlukan untuk js sudut. Tanpa rujukan ini, jika kita cuba menggunakan fungsi AngularJS, fungsi tersebut tidak akan berfungsi.
- "Pengawal" adalah tempat di mana kita benar-benar membuat logik perniagaan kita, yang merupakan pengawal kita. Spesifik setiap kata kunci akan dijelaskan dalam bab-bab berikutnya. Apa yang penting untuk diperhatikan bahawa kita menentukan kaedah pengawal yang disebut 'HelloWorldCtrl' yang dirujuk dalam Langkah2.
- Kami membuat "fungsi" yang akan dipanggil ketika kod kami memanggil pengawal ini. Objek lingkup $ adalah objek khas di AngularJS yang merupakan objek global yang digunakan dalam Angular.js. Objek lingkup $ digunakan untuk menguruskan data antara pengawal dan pandangan.
- Kami membuat pemboleh ubah anggota yang disebut "pesan", memberikan nilai "HelloWorld" dan melampirkan pemboleh ubah anggota ke objek lingkup.
CATATAN : Arahan ng-pengawal adalah kata kunci yang ditentukan dalam AngularJS (langkah # 2) dan digunakan untuk menentukan pengawal dalam aplikasi anda. Di sini dalam aplikasi kami, kami telah menggunakan kata kunci ng-pengawal untuk menentukan pengawal bernama 'HelloWorldCtrl'. Logik sebenar untuk pengawal akan dibuat dalam (langkah # 5).
Sekiranya arahan itu berjaya dilaksanakan, Output berikut akan ditunjukkan semasa anda menjalankan kod anda di penyemak imbas.
Pengeluaran:
Mesej 'Hello World' akan dipaparkan.
