Analisis mendalam modul dalam AngularJS_AngularJS

Apakah modul AngularJS

Modul yang kita bicarakan adalah sebahagian daripada aplikasi AngularJS anda. Ia boleh menjadi Pengawal, Perkhidmatan, Penapis atau arahan ) dan lain-lain... semuanya tergolong dalam satu modul.

Kebanyakan aplikasi mempunyai kaedah kemasukan fungsi mereka sendiri Utama, yang digunakan untuk memulakan, memuatkan dan memasang pelbagai modul, dan kemudian gabungan modul ini membentuk aplikasi anda, bukan?

Tetapi, tetapi, aplikasi AngularJS tidak seperti ini. Ia tidak mempunyai kaedah utama dan tiada entri fungsi. Sebaliknya, ia dinyatakan dalam modul untuk mengisytiharkan cara modul ini harus dimuatkan dan dimulakan dalam aplikasi AngularJS.

Kaedah ini mempunyai kelebihan berikut:

1) Gunakan pengisytiharan untuk memudahkan orang ramai memahami.

2) Anda boleh menggunakan semula kod anda dengan lebih mudah.

3) Susunan pemuatan modul lebih mudah dikawal. Kerana modul ini dilaksanakan secara malas.

4) Ia menjadi lebih mudah untuk menjalankan ujian unit. Lebih dipercayai, anda hanya perlu memuatkan modul ini untuk menguji.

5) Dalam ujian hujung ke hujung, anda boleh menggunakan modul untuk menulis semula konfigurasi.

Modul ialah kewujudan teras dalam AngularJS, termasuk banyak aspek, seperti pengawal, konfigurasi, perkhidmatan, kilang, arahan, pemalar, dll.

Bagaimana untuk melaksanakan fungsi seperti modul dalam Javascript?

Dalam erti kata lain, jika kita mentakrifkan fungsi, bagaimanakah kita membuka fungsi dalam fungsi itu kepada dunia luar?

Saya berpendapat bahawa fungsi dalam fungsi boleh digunakan sebagai nilai utama objek untuk membukanya kepada dunia luar.

Sangat umum untuk mengatakan ini, tetapi sebenarnya seperti ini:

var myModule = function outerFuction(){
  var method1 = new function(){}
  var method2 = new function(){}
  return{
    method1: method1,
    method2, method2
  }
}
var o = outerFucntion();
o.method1();
o.mehtod2(); 

Berikan contoh deposit dan pengeluaran wang dari bank.

var account = function(){
 //余额
 var balance = 0;
 //存钱
 var deposit = function(money){
  balance+=money;
  console.log("卡上余额为： " + balance);
  notifyUser();
 }
 //取钱
 var withdraw = function(money){
  balance -= money;
  console.log("卡上余额为： " + balance)
  notifyUser();
 }
 //通知用户
 var notifyUser = function(){
  console.log("卡上余额有变动");
 }
 return {
  deposit:deposit,
  withdraw: withdraw
 }
}
var a1 = account();
a1.deposit(100);
a1.withdraw(50); 

Datang ke AngularJS, kami sudah biasa menulis seperti ini:

var app = angular.module('app',[]);
app.config();
app.controller();
app.factory();
... 

Iaitu, dapatkan modul dan kemudian hubungi kaedah yang disediakan oleh modul kepada kami.

Lihat kod sumber angular.js dan cari:

angular = window.angular || (window.angular = {} )

Inilah sebabnya kita boleh menggunakan pembolehubah sudut.

...
var moduleInstace = {
    provider: invokeLater('$provide','provider'),
    factory: invokeLater('$provider', 'factory'),
    service: invokeLater('$provider', 'service'),
    value: invokeLater('$provide', 'value'),
    constant: invokeLater('$provider', 'constant'...),
    animation: invokeLater('$animateProvider',...),
    filter: invokeLater('$filterProvider',...),
    controller: invokeLater('$controllerProvider',...),
    directive: invokeLater('$compileProvider',...),
    config: config,
}
return moduleInstance;
... 

Kaedah penulisan di atas adalah tepat bagaimana modul ditulis.

PS: Terdapat perbezaan kecil tetapi penting antara angular.module('MyApp',[...]) dan angular.module('MyApp')

angular.module('MyApp',[...]) akan mencipta modul Angular baharu dan memuatkan senarai kebergantungan dalam kurungan segi empat sama ([...]); manakala angular.module('MyApp ') akan digunakan modul sedia ada yang ditakrifkan oleh panggilan pertama.

Jadi, untuk kod berikut, anda perlu memastikan bahawa ia hanya akan digunakan sekali dalam keseluruhan aplikasi:

angular.module('MyApp', [...]) //Jika aplikasi anda adalah modular, ini mungkin MyModule

Jika anda tidak bercadang untuk menyimpan rujukan modul dalam pembolehubah dan kemudian merujuk modul melalui pembolehubah ini sepanjang aplikasi, maka menggunakan angular.module(MyApp) dalam fail lain boleh memastikan anda mendapat rujukan Modul AngularJS yang betul . Segala-galanya pada modul mesti ditakrifkan dengan mengakses rujukan modul ini, atau dengan menambah kandungan yang diperlukan di mana modul ditakrifkan.