Perbedaan antara fungsi 'controller', 'link' dan 'compile' saat mendefinisikan suatu arahan

Beberapa tempat tampaknya menggunakan fungsi pengontrol untuk logika direktif dan yang lain menggunakan tautan. Contoh tab pada beranda sudut menggunakan pengontrol untuk satu dan tautan untuk pengarahan lain. Apa perbedaan keduanya?

Saya akan sedikit memperluas pertanyaan Anda dan juga menyertakan fungsi kompilasi.

• kompilasi fungsi - gunakan untuk manipulasi DOM templat (yaitu, manipulasi tElement = elemen templat), karenanya manipulasi yang berlaku untuk semua klon DOM templat yang terkait dengan arahan. (Jika Anda juga memerlukan fungsi tautan (atau fungsi tautan sebelum dan sesudah), dan Anda mendefinisikan fungsi kompilasi, fungsi kompilasi harus mengembalikan fungsi tautan karena 'link'atribut diabaikan jika 'compile'atribut ditentukan.)

• fungsi tautan - biasanya digunakan untuk mendaftarkan panggilan balik pendengar (yaitu, $watchekspresi pada ruang lingkup) serta memperbarui DOM (yaitu, manipulasi iElement = elemen contoh individual). Ini dieksekusi setelah template telah dikloning. Misalnya, di dalam <li ng-repeat...>, fungsi tautan dijalankan setelah <li>templat (tElement) telah dikloning (menjadi iElement) untuk <li>elemen tertentu . A $watchmemungkinkan arahan untuk diberitahu tentang perubahan properti lingkup (lingkup terkait dengan setiap instance), yang memungkinkan arahan untuk memberikan nilai instance yang diperbarui ke DOM.

• fungsi pengontrol - harus digunakan ketika arahan lain perlu berinteraksi dengan arahan ini. Misalnya, pada beranda AngularJS, arahan panel perlu menambahkan dirinya sendiri ke ruang lingkup yang dikelola oleh arahan tab, maka arahan tab perlu menentukan metode pengontrol (bayangkan API) yang arahan pane dapat akses / panggil.
  
  Untuk penjelasan yang lebih mendalam tentang arahan tab dan panel, dan mengapa arahan tab membuat fungsi pada pengontrolnya menggunakan this(bukan pada $scope), silakan lihat 'this' vs $ scope pada pengontrol AngularJS .

Secara umum, Anda dapat memasukkan metode $watches,, dll ke dalam pengontrol direktif atau fungsi tautan. Pengontrol akan berjalan terlebih dahulu, yang terkadang penting (lihat biola yang mencatat ketika fungsi ctrl dan tautan dijalankan dengan dua arahan bersarang). Seperti yang disebutkan Josh dalam komentar , Anda mungkin ingin meletakkan fungsi manipulasi-lingkup di dalam pengontrol hanya untuk konsistensi dengan sisa kerangka kerja.

Sebagai pelengkap jawaban Mark, fungsi kompilasi tidak memiliki akses ke cakupan, tetapi fungsi tautannya.

Saya sangat merekomendasikan video ini; Arahan Menulis oleh Misko Hevery (ayah dari AngularJS), di mana ia menggambarkan perbedaan dan beberapa teknik. (Perbedaan antara fungsi kompilasi dan fungsi tautan pada tanda 14:41 di video ).

1. menjalankan kode sebelum Kompilasi: gunakan controller
2. menjalankan kode setelah Kompilasi: gunakan Tautan

Konvensi sudut: tulis logika bisnis di pengontrol dan manipulasi DOM di tautan.

Terlepas dari ini, Anda dapat memanggil satu fungsi pengontrol dari fungsi tautan dari arahan lain. Misalnya Anda memiliki 3 arahan khusus

<animal>
<panther>
<leopard></leopard>
</panther> 
</animal>

dan Anda ingin mengakses hewan dari dalam direktif "macan tutul".

http://egghead.io/lessons/angularjs-directive-communication akan sangat membantu untuk mengetahui tentang komunikasi antar-direktif

fungsi kompilasi -

1. dipanggil sebelum fungsi pengontrol dan tautan.
2. Dalam fungsi kompilasi, Anda memiliki template DOM asli sehingga Anda dapat membuat perubahan pada DOM asli sebelum AngularJS membuat instance dan sebelum ruang lingkup dibuat
3. ng-repeat adalah contoh sempurna - sintaks asli adalah elemen template, elemen yang diulang dalam HTML adalah instance
4. Mungkin ada beberapa instance elemen dan hanya satu elemen template
5. Lingkup belum tersedia
6. Fungsi kompilasi dapat mengembalikan fungsi dan objek
7. mengembalikan fungsi (pasca-tautan) - sama dengan mendaftarkan fungsi tautan melalui properti tautan dari objek konfigurasi saat fungsi kompilasi kosong.
8. mengembalikan objek dengan fungsi yang terdaftar melalui properti pre dan post - memungkinkan Anda untuk mengontrol kapan fungsi penautan harus dipanggil selama fase penautan. Lihat info tentang fungsi pre-linking dan post-linking di bawah ini.

sintaksis

function compile(tElement, tAttrs, transclude) { ... }

pengontrol

1. dipanggil setelah fungsi kompilasi
2. ruang lingkup tersedia di sini
3. dapat diakses oleh arahan lain (lihat memerlukan atribut)

pra-tautan

1. Fungsi tautan bertanggung jawab untuk mendaftarkan pendengar DOM serta memperbarui DOM. Itu dieksekusi setelah template telah dikloning. Di sinilah sebagian besar logika arahan akan diletakkan.

2. Anda dapat memperbarui dom di controller menggunakan angular.element tetapi ini tidak dianjurkan karena elemen disediakan dalam fungsi tautan

3. Fungsi pra-tautan digunakan untuk mengimplementasikan logika yang berjalan ketika sudut js telah mengkompilasi elemen turunan tetapi sebelum salah satu tautan pos elemen turunan dipanggil

posting-tautan

1. arahan yang hanya memiliki fungsi tautan, sudut memperlakukan fungsi tersebut sebagai tautan pos

2. posting akan dieksekusi setelah kompilasi, pengontrol dan fungsi pre-link, jadi itu sebabnya ini dianggap sebagai tempat teraman dan default untuk menambahkan logika arahan Anda