Все залежить від того, що потрібно від фрагмента коду. Особисто, якщо код не має логіки або навіть не потрібен контролер, тоді я переходжу з ngInclude
. Я, як правило, розміщую великі більш "статичні" фрагменти HTML, які я не хочу захаращувати погляд. (тобто: Скажімо, велика таблиця, дані якої так чи інакше надходять від батьківського контролера. Це чистіше, <div ng-include="bigtable.html" />
ніж усі ці рядки, що захаращують погляд)
Якщо є логіка, маніпуляція з DOM, або вам потрібно, щоб вона була налаштована (інакше вона відображається по-різному) у різних випадках, тоді вона directives
є кращим вибором (вони спочатку хизуються, але вони дуже потужні, дайте їй час) .
ngInclude
Іноді ви побачите, ngInclude's
що на них впливає їх зовнішність $scope
/ interface
. Такий, як великий / складний ретранслятор, дозволяє сказати. Ці 2 інтерфейси пов'язані між собою через це. Якщо щось в основному $scope
зміниться, ви повинні змінити / змінити свою логіку в межах включеної часткової.
Директиви
З іншого боку, директиви можуть мати чіткі області застосування / контролери / тощо. Отже, якщо ви думаєте про сценарій, коли вам доведеться повторно використовувати щось кілька разів, ви можете побачити, як пов'язаний власний обсяг полегшить життя та менше заплутаний.
Крім того, у будь-який час, коли ви взагалі збираєтесь взаємодіяти з DOM, вам слід використовувати директиву. Це полегшує тестування і відключає ці дії від контролера / служби / тощо, що ви хочете!
Порада: Переконайтеся, що не використовуйте обмеження: "E", якщо ви дбаєте про IE8! Існують шляхи навколо цього, але вони дратують. Просто полегшіть життя та дотримуйтесь атрибутів / тощо.<div my-directive />
Компоненти [Оновлення 3.01.2016]
Доданий у Angular 1.5, він по суті є обгорткою .directve()
. Компонент слід використовувати більшу частину часу. Він видаляє багато директивних кодів котлоагрегату за замовчуванням до таких речей restrict: 'E', scope : {}, bindToController: true
. Настійно рекомендую використовувати їх майже для всього додатка, щоб легше перейти до Angular2.
На закінчення:
Ви повинні створювати компоненти та директиви більшу частину часу.
- Більш розширювані
- Ви можете шаблонувати та мати свій файл зовні (наприклад, ngInclude)
- Ви можете скористатися батьківською областю або її власною ізоляцією в межах директиви.
- Краще повторне використання вашої програми
Оновлення 1.01.2016
Тепер, коли Angular 2 повільно загортається, і ми знаємо загальний формат (звичайно, все ще будуть якісь зміни тут і там) просто хотів додати, як це важливо зробити components
(іноді директиви, якщо вам потрібно, щоб вони були обмеженими: ' E ', наприклад).
Компоненти дуже схожі на кутові 2 @Component
. Таким чином ми інкапсулюємо логіку та html в тій же області.
Переконайтеся, що ви інкапсулюєте якомога більше речей у компоненти, це значно полегшить перехід на Angular 2! (Якщо ви вирішили зробити перехід)
Ось приємна стаття, що описує цей процес міграції з використанням directives
(дуже схожа, якщо ви збиралися використовувати компоненти звичайно): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/