Ringkasan
Bagian ini menjelaskan proses inisialisasi AngularJS dan bagaimana Anda harus memodifikasi inisialisasi AngularJS saat diperlukan.
Tag <script> AngularJS
Contoh ini menunjukkan metode yang kami rekomendasikan untuk mengintegrasikan AngularJS, yang disebut "inisialisasi otomatis".
Salinan kode adalah sebagai berikut:
<! Doctype html>
<html xmlns: ng = "http://angularjs.org" ng-app>
<body>
...
<skrip src = "angular.js"> <script>
</body>
</html>
formatDate
1. Tempatkan tag skrip di kode di atas di bagian bawah halaman. Menempatkan tag skrip di bagian bawah memperpendek waktu pemuatan aplikasi, karena pemuatan HTML tidak akan diblokir oleh pemuatan skrip Angular.js. Anda bisa mendapatkan versi terbaru dari http://code.angularjs.org. Harap jangan merujuk ke URL ini dalam kode Anda, karena akan mengekspos risiko keamanan situs Anda. Jika itu hanya perkembangan eksperimental, tidak ada masalah yang menghubungkan ke situs kami.
1) .angular- [versi] .js adalah versi yang dapat dibaca yang cocok untuk pengembangan dan debugging.
2) .angular- [versi] .min.js adalah versi terkompresi dan dikaburkan, cocok untuk penyebaran dalam produk yang dicetak.
2. Harap masukkan arahan NG-APP ke dalam node root tag aplikasi Anda. Jika Anda ingin AngularJS secara otomatis mengeksekusi seluruh program <HTML>, masukkan ke dalam tag <html>.
Salinan kode adalah sebagai berikut:
<html ng-app>
3. Jika Anda ingin menggunakan versi lama dari sintaks instruksi: ng:, Anda juga perlu menulis xml-namespace di <html> untuk membuat angularjs berfungsi secara normal di bawah IE. (Ini dilakukan karena beberapa alasan historis, dan kami tidak merekomendasikan terus menggunakan NG: Sintaks.)
Salinan kode adalah sebagai berikut:
<html xmlns: ng = "http://angularjs.org">
Inisialisasi Otomatis
AngularJS akan dieksekusi ketika acara DOMContentloaded dipicu dan akan menggunakan Petunjuk NG-APP untuk menemukan ruang lingkup root aplikasi Anda. Jika arahan NG-APP ditemukan, AngularJS akan:
1. Muat modul yang terkait dengan konten instruksi.
2. Buat "injektor" aplikasi.
3. Tag directive NG-APP adalah simpul root untuk mengkompilasi DOM. Ini memungkinkan Anda untuk menentukan hanya sebagian dari DOM sebagai aplikasi AngularJS Anda.
Salinan kode adalah sebagai berikut:
<! Doctype html>
<html ng-app = "opsionalModulename">
<body>
Saya dapat menambahkan: {{1+2}}.
<skrip src = "angular.js"> </script>
</body>
</html>
Inisialisasi Manual
Jika Anda perlu mengambil inisiatif untuk mengontrol proses inisialisasi, Anda dapat menggunakan metode menjalankan program boot secara manual. Misalnya, ketika Anda menggunakan "skrip loader" atau perlu melakukan beberapa operasi sebelum AngularJS mengkompilasi halaman, Anda akan menggunakannya.
Contoh berikut menunjukkan cara inisialisasi secara manual AngularJS. Efeknya setara dengan menggunakan arahan NG-APP.
Salinan kode adalah sebagai berikut:
<! Doctype html>
<html xmlns: ng = "http://angularjs.org">
<body>
Halo {{'world'}}!
<skrip src = "http://code.angularjs.org/angular.js"> </script>
<script>
angular.element (dokumen) .ready (function () {
angular.bootstrap (dokumen);
});
</script>
</body>
</html>
Berikut adalah beberapa pesanan yang harus diikuti oleh kode Anda:
1. Setelah halaman dan semua skrip dimuat, temukan simpul root dari template HTML - biasanya simpul root dokumen.
2. Call API/Angular.BootStrap untuk mengkompilasi templat menjadi aplikasi yang dapat dieksekusi dan pengikatan data.