Dependency Injection adalah corak reka bentuk perisian yang menentukan cara komponen memegang kebergantungannya. Komponen diberi kebergantungannya dan bukannya pengekodan keras. Kebolehgunaan dan pemeliharaan semula dapat dicapai dengan menggunakan suntikan kebergantungan. Suntikan Ketergantungan Tertinggi di boleh dilakukan dengan komponen berikut:
Suntikan Ketergantungan Nilai
Objek sederhana dalam AngularJs dikenali sebagai nilai. Ini boleh berupa string, angka atau bahkan objek JavaScript. Ia dapat digunakan untuk menyampaikan nilai di kilang, perkhidmatan atau pengawal semasa fasa menjalankan dan konfigurasi.
Contoh:
// tentukan modul
var firstModule = angular.module ('firstModule', [])
// buat objek nilai dan lulus data kepadanya
firstModule.value ('numberValue', 50)
firstModule.value ('stringValue', 'xyz')
firstModule.value ('objectValue', {val1: 456, val2: 'xyz'})
Dalam contoh ini, nilai ditentukan menggunakan fungsi nilai (). Nama nilai ditentukan oleh parameter pertama, dan parameter kedua menentukan nilainya. Ini membolehkan kilang, perkhidmatan, dan pengawal untuk merujuk nilai-nilai ini dengan nama mereka sendiri.
Menyuntik Nilai
Kita dapat memasukkan nilai ke dalam fungsi pengawal AngularJs dengan menambahkan parameter dengan nama yang sama dengan nilai.
Contoh:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 18)
firstModule.controller ('FirstController', fungsi ($ lingkup, numberValue) {
console.log (numberValue)
})
Suntikan Kilang
Fungsi yang mencipta nilai dikenali sebagai kilang. Nilai atas permintaan dibuat oleh kilang, setiap kali perkhidmatan atau pengawal memerlukan nilai yang disuntik dari kilang. Setelah nilai dibuat, ia digunakan semula untuk semua perkhidmatan dan pengawal.
Ia menggunakan fungsi kilang untuk mengira dan mengembalikan nilainya.
Contoh:
var firstModule = angular.module ('firstModule', [])
firstModule.factory ('firstFactory', fungsi () {
mengembalikan 'nilai'
})
firstModule.controller ('FirstController', fungsi ($ lingkup, firstFactory) {
console.log (kilang pertama)
c ++ algoritma penggabungan jenis
})
Menyuntik nilai ke kilang
Nilai boleh disuntik ke kilang dengan kaedah berikut:
var firstModule = angular.module ('firstModule', [])
firstModule.value ('numberValue', 29)
firstModule.controller ('FirstController', fungsi ($ lingkup, numberValue) {
console.log (numberValue)
})
Harus diingat bahawa nilaiyang dihasilkan oleh fungsi kilang disuntik, bukan fungsi kilang itu sendiri. Mari kita lanjutkan dengan artikel Dependency Injection ini di AngularJs.
Suntikan Perkhidmatan di AngularJs
Objek JavaScript tunggal yang mengandungi sekumpulan fungsi dikenal sebagai perkhidmatan di AngularJs. Logik yang diperlukan untuk menjalankan perkhidmatan terkandung dalam fungsi. Perkhidmatan dapat dibuat dengan menggunakan fungsi service () pada modul.
Contoh:
// tentukan modul
var firstApp = angular.module ('firstApp', [])
...
// buat perkhidmatan yang menentukan kaedah kuadrat untuk mengembalikan kuasa dua nombor
firstApp.service ('CalciService', fungsi (MathService) {
ini.square = fungsi (x) {
kembalikan MathService.multiply (x, x)
}
})
// masukkan perkhidmatan 'CalciService' ke dalam alat kawalan
firstApp.controller ('CalciController', fungsi ($ skop, CalciService,
lalaiInput) {
$ lingkup.number = defaultInput
$ lingkup.result = CalciService.square ($ lingkup.number)
$ lingkup.square = fungsi () {
$ lingkup.result = CalciService.square ($ lingkup.number)
}
})
Penyedia
Untuk membuat perkhidmatan atau kilang secara dalaman semasa fasa konfigurasi, kami menggunakan Penyedia. Penyedia adalah kaedah kilang khas dengan fungsi get () yang digunakan untuk mengembalikan nilai / perkhidmatan / kilang.
Contoh:
// tentukan modul
var firstApp = angular.module ('firstApp', [])
...
// buat perkhidmatan menggunakan penyedia yang menentukan kaedah kaedah untuk mengembalikan
segiempat sama nombor.
firstApp.config (fungsi ($ sediakan) {
$ menyediakan.provider ('MathService', fungsi () {
ini. $ get = function () {
kilang var =
factory.multiply = fungsi (x, y) {
pulangan x * y
}
balik kilang
}
})
})
Pemalar
Oleh kerana pengguna tidak dapat memasukkan nilai ke dalam fungsi module.config (), kami menggunakan pemalar. Pemalar digunakan untuk meneruskan nilai pada fasa konfigurasi.
firstApp.constant ('configParam', 'nilai tetap')
Contoh:
Arahan yang disebutkan di atas dapat digunakan dengan cara berikut:
Suntikan Ketergantungan
Contoh Penjarangan AngularJS
Masukkan sebarang nombor:
X2
Hasil: {{hasil}}
var firstApp = angular.module ('firstApp', [])
firstApp.config (fungsi ($ sediakan) {
$ menyediakan.provider ('MathService', fungsi () {
ini. $ get = function () {
kilang var =
factory.multiply = fungsi (x, y) {
pulangan x * y
}
balik kilang
}
apakah gandingan longgar di java
})
})
firstApp.value ('defaultInput', 6)
firstApp.factory ('MathService', fungsi () {
kilang var =
factory.multiply = fungsi (x, y) {
pulangan x * y
}
balik kilang
})
firstApp.service ('CalciService', fungsi (MathService) {
ini.square = fungsi (x) {
kembalikan MathService.multiply (x, x)
}
})
firstApp.controller ('CalciController', fungsi ($ lingkup, CalciService, defaultInput) {
$ lingkup.number = defaultInput
$ lingkup.result = CalciService.square ($ lingkup.number)
$ lingkup.square = fungsi () {
$ lingkup.result = CalciService.square ($ lingkup.number)
}
})
PENGELUARAN:
Dengan ini, kita akan mengakhiri Injeksi Ketergantungan ini dalam artikel AngularJs. C lihatlah oleh Edureka, sebuah syarikat pembelajaran dalam talian yang dipercayai dengan rangkaian lebih daripada 250,000 pelajar berpuas hati yang tersebar di seluruh dunia.
Ada soalan untuk kami? Sila sebutkan di bahagian komen Dependency Injection ini di AngularJs dan kami akan menghubungi anda.