Компонент Angular 1.5 против старой директивы — где функция ссылки?

EDIT 2/2/16: Документация 1.5 теперь охватывает компоненты: https://docs.angularjs.org/guide/component

Некоторые мысли, основанные на некоторых чтениях (ссылки ниже):

• Компоненты не заменяют директивы. Компонент — это особый тип директивы, которая организует контроллер с помощью шаблона.

• Компоненты не имеют функции связи, а контроллеры по-прежнему не используются для манипуляций с DOM.

• Если вам нужны манипуляции с DOM, ваш компонент может использовать другие директивы, которые включают эту манипуляцию с DOM в функцию ссылки.

Мне потребовалось некоторое время, чтобы понять это, но как только я это понял, это обрело смысл: компоненты — это директивы, но не все директивы являются — или должны быть — компонентами.

Вопрос о функциях ссылок является естественным, или был для меня естественным, когда я думал, что компоненты заменяют директивы. Почему? Потому что нас учили помещать манипуляции с DOM в функцию ссылки директивы: «Директивы, которые хотят изменить DOM, обычно используют параметр ссылки для регистрации прослушивателей DOM, а также для обновления DOM». https://docs.angularjs.org/guide/directive.

Если вы работаете с этим предположением (компоненты заменяют директивы), то вы обнаружите, что документы Angular не отвечают на вопрос, потому что это неправильный вопрос, когда вы знаете назначение компонента. (Компоненты описаны в документации $compileProvider, а не в документация по директиве.)

Фоновое чтение

То, что я сказал выше, на самом деле является перефразированием того, что сказал Тодд Мотто в, возможно, лучшем (пока что) обсуждении компонентов и директив:

https://www.reddit.com/r/angularjs/comments/3taxjq/angular_15_is_set_to_introduce_the_component/

Было бы полезно включить эти комментарии в более общую статью.

В большинстве статей о компонентах функция ссылки не упоминается (это не значит, что это плохие статьи):

https://toddmotto.com/exploring-the-angular-1-5-component-method/

https://medium.com/@tomastrajan/component-paradigm-cf32e94ba78b#.vrbo1xso0

https://www.airpair.com/angularjs/posts/component-based-angularjs-directives

Или, когда упоминается функция ссылки, она заключена в круглые скобки:

http://teropa.info/blog/2015/10/18/refactoring-angular-apps-to-components.html

В одной статье говорится эти компоненты «используют контроллеры вместо функций связи». Но это не ситуация «вместо»: контроллеры не заменяют функции связи.

Это упрощает написание приложения аналогично использованию веб-компонентов или использованию стиля архитектуры приложения Angular 2.

Преимущества компонентов:

более простая конфигурация, чем простые директивы, способствует разумным значениям по умолчанию и лучшим практикам, оптимизированным для архитектуры на основе компонентов. Написание директив для компонентов упростит переход на Angular 2.

Когда нельзя использовать Компоненты:

для директив, которые полагаются на манипулирование DOM, добавление прослушивателей событий и т. д., поскольку функции компиляции и связывания недоступны, когда вам нужны расширенные параметры определения директивы, такие как приоритет, терминал, многоэлементность, когда вы хотите директиву, которая запускается атрибутом или классом CSS , а не элемент

Обновление (от 22 августа 2017 г.): $inject рекомендуется для этого в AngularJS. Прочтите руководство по стилю: руководство по стилю ссылка и документы AngularJS: документы AngularJS

app.component('pickerField', {
    controller: PickerField,
    template: '<span>Your template goes here</span>'
  });

  PickerField.$inject = ['$element'];

  function PickerField(element) {
    var self = this;
    self.model = self.node.model;
    self.open = function() {
      console.log('smth happens here');
    };
    element.bind('click', function(e) {
      console.log('clicked from component', e);
      self.open();
    });
  }