modul AngularJS
Modul mendefinisikan sebuah aplikasi.
Modul adalah suatu wadah di berbagai aplikasi.
modul controller adalah aplikasi kontainer.
controller biasanya milik modul.
Buat modul
Anda dapat membuat modul oleh AngularJS fungsiangular.module:
<Script>
var aplikasi = angular.module ( "myApp" , []);
"MyApp" parameter sesuai dengan pelaksanaan elemen aplikasi HTML.
Sekarang Anda dapat menambahkan controller petunjuk, filter, dll dalam aplikasi AngularJS.
Tambahkan Pengontrol
Anda dapat menggunakan petunjukng-controller untuk menambahkan aplikasi Controller:
AngularJS contoh
{{FirstName + "" + lastName }}
</ Div>
<Script>
app.controller ( "myCtrl", function ( $ lingkup) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
});
Coba »
Anda dapat AngularJS Controller belajar lebih banyak pengetahuan tentang bagian pengontrol.
Tambahkan petunjuk
AngularJS menyediakan banyak built-in perintah, Anda dapat menggunakannya untuk menambahkan fungsionalitas ke aplikasi Anda.
Petunjuk lengkap dapat ditemukan dalam isi panduan AngularJS referensi .
Selain itu, Anda dapat menggunakan modul untuk menambahkan aplikasi instruksi Anda sendiri:
AngularJS contoh
<Script>
app.directive ( "w3bigDirective", function ( ) {
kembali {
Template: "Aku menciptakan instruksi konstruktor!"
};
});
Coba »
Anda dapat AngularJS arahan belajar lebih banyak pengetahuan tentang bagian instruksi.
Modul dan pengendali termasuk dalam file JS
Biasanya AngularJS modul aplikasi dan controller termasuk dalam file JavaScript.
Dalam contoh berikut, "myApp.js" berisi definisi dari modul program aplikasi, "myCtrl.js" file berisi controller:
AngularJS contoh
<Html>
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<Body>
<Div ng-app = "myApp " ng-controller = "myCtrl">
{{FirstName + "" + lastName }}
</ Div>
<Script src = "myApp.js"> </ script>
<Script src = "myCtrl.js"> </ script>
</ Body>
</ Html>
Coba »
myApp.js
 | Dalam definisi modul [] parameter yang digunakan untuk menentukan modul dependensi. Kurung [] menunjukkan bahwa modul tidak bergantung pada, jika ada ketergantungan, maka akan tergantung pada nama modul yang ditulis dalam tanda kurung. |
|---|
myCtrl.js
$scope.firstName = "John";
$scope.lastName= "Doe";
});
Fungsi akan mempengaruhi namespace global
JavaScript harus menghindari menggunakan fungsi global. Karena mereka dapat dengan mudah ditutupi dengan file script lain.
AngularJS lingkup modul sehingga semua fungsi dalam modul, untuk menghindari masalah.
Ketika memuat perpustakaan?
| Dalam contoh kita, semua dokumen perpustakaan AngularJS HTML dimuat di kepala. |
|---|
Untuk aplikasi HTML umumnya direkomendasikan untuk semua skrip yang ditempatkan di bawah <body> elemen.
Hal ini akan meningkatkan kecepatan loading halaman, karena HTML tidak dikenakan memuat script untuk memuat.
Dalam contoh beberapa AngularJS kami, Anda akan melihat perpustakaan AngularJS dimuat dalam <head> area dokumen.
Dalam contoh kita, AngularJS di <head> elemen dimuat, karena panggilan untuk angular.module hanya dilakukan setelah selesainya memuat perpustakaan.
Solusi lain adalah untuk memuat AngularJS perpustakaan <body> elemen, tetapi harus ditempatkan di depan script AngularJS Anda:
AngularJS contoh
<Html>
<Head>
<Meta charset = "utf-8 ">
<Script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
</ Kepala>
<Body>
<Div ng-app = "myApp " ng-controller = "myCtrl">
{{FirstName + "" + lastName }}
</ Div>
<Script>
var aplikasi = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ lingkup) {
$ Scope.firstName = "John";
$ Scope.lastName = "Doe";
});
</ Script>
</ Body>
</ Html>
Coba »