Я не совсем понимаю, когда использовать директиву, а когда более целесообразно использовать nginclude. Возьмем этот пример: у меня есть частичный, password-and-confirm-input-fields.htmlто есть html для ввода и подтверждения пароля. Я использую это как на странице регистрации, так и на странице смены пароля. Каждая из этих двух страниц имеет контроллер, а частичный HTML-код не имеет выделенного контроллера.
Следует использовать директиву или ngIncludeдля этого?
Ответы:
Все зависит от того, что вы хотите от фрагмента кода. Лично, если в коде нет никакой логики или даже не нужен контроллер, я соглашусь ngInclude. Я обычно помещаю большие более «статические» фрагменты HTML, которые я не хочу загромождать здесь представление. (то есть: скажем, большая таблица, данные которой в любом случае поступают от родительского контроллера. Это чище, <div ng-include="bigtable.html" />чем все эти строки, загромождающие представление)
Если есть логика, манипуляции с DOM или вам нужно, чтобы ее можно было настраивать (иначе визуализировать по-разному) в разных случаях, когда она используется, то directivesэто лучший выбор (сначала они пугающие, но они очень мощные, дайте время) .
Иногда вы увидите, ngInclude'sчто на них влияет их внешний вид $scope/ interface. Например, большой / сложный репитер. Эти 2 интерфейса связаны друг с другом из-за этого. Если что-то в основном $scopeизменится, вы должны изменить / изменить свою логику в включенном партиале.
С другой стороны, директивы могут иметь явные области действия / контроллеры / и т. Д. Поэтому, если вы думаете о сценарии, в котором вам придется повторно использовать что-то несколько раз, вы можете увидеть, как подключение его собственной области может сделать жизнь проще и меньше. сбивает с толку.
Кроме того, всякий раз, когда вы собираетесь вообще взаимодействовать с DOM, вы должны использовать директиву. Это делает его более удобным для тестирования и отделяет эти действия от контроллера / службы / и т.д., что вам и нужно!
Совет: Убедитесь , что не использовать ограничения: «E» , если вы заботитесь о IE8! Есть способы обойти это, но они раздражают. Просто упростите жизнь и придерживайтесь атрибута / etc.<div my-directive />
Добавлено в Angular 1.5, по сути, это оболочка .directve(). Компонент следует использовать большую часть времени. Он удаляет много шаблонного кода директивы, по умолчанию для таких вещей, как restrict: 'E', scope : {}, bindToController: true. Я настоятельно рекомендую использовать их почти для всего в вашем приложении, чтобы упростить переход на Angular2.
Вы должны создавать компоненты и директивы большую часть времени.
Теперь, когда Angular 2 медленно завершается, и мы знаем общий формат (конечно, кое-где еще будут некоторые изменения), просто хотели добавить, насколько это важно components(иногда директивы, если вам нужно, чтобы они были ограничены: ' E 'например).
Компоненты очень похожи на Angular 2 @Component. Таким образом, мы инкапсулируем логику и HTML в одной и той же области.
Убедитесь, что вы инкапсулируете как можно больше вещей в компоненты, это значительно упростит переход на Angular 2! (Если вы решите осуществить переход)
Вот хорошая статья, описывающая этот процесс миграции с использованием directives(очень похожего, если вы, конечно, собирались использовать компоненты): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/
linkфункции и вуаля! Хотя, без сомнения, было бы неплохо вписать в директивы :( @Arwin