Saya tidak begitu mengerti kapan harus menggunakan direktif dan kapan lebih tepat menggunakan nginclude. Ambil contoh ini: Saya memiliki sebagian password-and-confirm-input-fields.html
,, itu adalah html untuk memasukkan dan mengonfirmasi kata sandi. Saya menggunakan ini baik di bawah halaman pendaftaran dan di bawah halaman ubah sandi. Kedua halaman tersebut masing-masing memiliki pengontrol, sebagian html tidak memiliki pengontrol khusus.
Haruskah saya menggunakan direktif atau ngInclude
untuk ini?
Jawaban:
Itu semua tergantung pada apa yang Anda inginkan dari fragmen kode Anda. Secara pribadi, jika kode tidak memiliki logika apa pun, atau bahkan tidak memerlukan pengontrol, maka saya akan menggunakannya
ngInclude
. Saya biasanya meletakkan lebih banyak fragmen html "statis" yang tidak ingin mengacaukan tampilan di sini. (Misal: Katakanlah sebuah tabel besar yang datanya berasal dari Pengontrol induk. Ini lebih bersih untuk dimiliki<div ng-include="bigtable.html" />
daripada semua baris yang mengacaukan Tampilan)Jika ada logika, manipulasi DOM, atau Anda membutuhkannya untuk dapat disesuaikan (alias dirender secara berbeda) dalam berbagai contoh yang digunakan, maka
directives
adalah pilihan yang lebih baik (awalnya menakutkan, tetapi sangat kuat, berikan waktu) .ngInclude
Terkadang Anda akan melihat
ngInclude's
bahwa dipengaruhi oleh eksterior$scope
/interface
. Seperti repeater besar / rumit katakanlah. 2 antarmuka ini diikat menjadi satu karena ini. Jika sesuatu dalam$scope
perubahan utama , Anda harus mengubah / mengubah logika Anda dalam parsial yang Anda sertakan.Arahan
Di sisi lain, arahan dapat memiliki cakupan / pengontrol / dll yang eksplisit. Jadi jika Anda memikirkan skenario di mana Anda harus menggunakan kembali sesuatu beberapa kali, Anda dapat melihat bagaimana memiliki cakupannya sendiri yang terhubung akan membuat hidup lebih mudah & lebih sedikit. membingungkan.
Selain itu, kapan pun Anda akan berinteraksi dengan DOM, Anda harus menggunakan arahan. Ini membuatnya lebih baik untuk pengujian, dan memisahkan tindakan ini dari pengontrol / layanan / dll, yang merupakan sesuatu yang Anda inginkan!
Tip: Pastikan untuk tidak menggunakan batasan: 'E' jika Anda peduli dengan IE8! Ada cara untuk mengatasi ini, tetapi mereka menjengkelkan. Buat hidup lebih mudah dan pertahankan dengan atribut / etc.
<div my-directive />
Komponen [Pembaruan 3/1/2016]
Ditambahkan di Angular 1.5, ini pada dasarnya adalah pembungkus
.directve()
. Komponen harus digunakan di sebagian besar waktu. Ini menghapus banyak kode direktif boilerplate, dengan default ke hal-hal sepertirestrict: 'E', scope : {}, bindToController: true
. Saya sangat merekomendasikan menggunakan ini untuk hampir semua yang ada di aplikasi Anda, agar dapat beralih ke Angular2 dengan lebih mudah.Kesimpulannya:
Anda harus membuat Komponen & Direktif di sebagian besar waktu.
Perbarui 3/1/2016
Sekarang Angular 2 perlahan-lahan selesai, dan kami tahu format umumnya (tentu saja masih akan ada beberapa perubahan di sana-sini) hanya ingin menambahkan betapa pentingnya hal itu untuk dilakukan
components
(terkadang arahan jika Anda membutuhkannya untuk dibatasi: ' E 'misalnya).Komponennya sangat mirip dengan Angular 2
@Component
. Dengan cara ini kami merangkum logika & html di area yang sama.Pastikan Anda merangkum sebanyak mungkin hal dalam komponen, ini akan membuat transisi ke Angular 2 jauh lebih mudah! (Jika Anda memilih untuk melakukan transisi)
Berikut adalah artikel bagus yang menjelaskan proses migrasi ini menggunakan
directives
(sangat mirip jika Anda akan menggunakan komponen tentunya): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/sumber
link
fungsi dan voila! Akan lebih baik jika dimasukkan ke dalam arahan, tanpa keraguan :( @Arwin