AngularJS: директивы против контроллеров. Какую логику поставить где?

Ответ 1

Прежде всего, большой вопрос. Я думаю, каждый разработчик new-with- angular борется с различиями со всеми этими компонентами (контроллер, директива, сервис, фильтр и т.д.).

Начнем с основного формального определения:

Директивы - это маркеры в элементе DOM, которые сообщают компилятору HTML AngularJS о прикреплении указанного элемента к этому элементу DOM.

А с другой стороны

Контроллер - это функция конструктора JavaScript, которая используется для увеличения области Angular Scope

Определенное поведение действительно помогает нам с помощью некоторого правила.

Итак, для ваших вопросов выше:

• Простыми словами, мы, пользовательские контроллеры, управляем областью (областью) в Шаблон HTML со всеми замечательными способностями, которые контроллер приносит (двустороннее связывание, поведение в области охвата, инъекции услуг и т.д.). И мы Используйте директивы, когда мы хотим манипулировать существующим HTML-элементом или В большинстве сценариев настраивается собственный, когда мы думаем о повторном использовании Эти элементы.
• Это зависит от контекста того, что должен делать ng-click. Допустим, у вас есть ваша настроенная директива для ввода числового значения, которое имеет настроенную конструкцию и поведение, как вы определили в своей директивной конфигурации. И вы используете его в форме, которую ng-click предположил, чтобы поместить модальный с дополнительными значениями и использовать его в другом месте приложения, а ng-click сделает что-то еще. В этом случае функция должна быть scope.fucntion. но пусть говорят, что и местоположение, и все остальные будут делать то же самое, это возьмет функцию в область действия директивы.
• Отвечено выше:)
• Каждый из ваших вариантов будет делать это, где "мнение" принимает и меньше правил большого пальца. Зачем? потому что оба пути будут работать, когда у каждого есть плюсы и минусы. Эмпирическое правило, которое я могу найти в сценарии, состоит в том, что если оба элемента являются частью шаблона директивы, я бы ожидал, что "behavious" (функция перетаскивания) будет частью области действия директивы.

Удачи.

Ответ 2

1) Есть ли хорошее эмпирическое правило, чтобы узнать, какой код поставить где?

Здесь много вещей; и я не уверен, что идет борьба с "директивами против контролеров". Они кажутся мне разными. Директивы могут иметь свои собственные контроллеры, если вы этого не знали.

Я рассматриваю директивы как единый, определенный, набор инкапсулированного кода, включая HTML (View) и JavaScript-код (Controller). Я использую директивы, когда хочу повторно использовать что-то как "инкапсулированный" компонент.

Если у меня есть только код JavaScript, который я хочу повторно использовать; Я поставлю услугу AngularJS, которую я вижу как набор кода JavaScript без HTML.

У меня есть директива с шаблоном, который я использую только в своем приложении. Что-то должно произойти, когда я нажимаю на элемент. я уже знаю его предпочтительнее использовать директиву ng-click по привязке клика событие в связанной функции. Но где я должен определить метод поставляется в ng-click?

Я бы определил обработчик как часть выделенной области действия; что-то вроде этого:

scope: 
{            
    onButtonClick: '&onButtonClick'
}

Определите поведение по умолчанию как часть ссылки или контроллера директивы.

link: function ( $scope, element, attrs ) {
  $scope.myDefaultButtonClick = function(){
    // do stuff
  }

        this.onInit = function(){
            if(!$scope.onButtonClick){
                $scope.onButtonClick = $scope.myDefaultButtonClick;
            }
        }
        this.onInit();
}

В вашем JavaScript; вы можете вызвать функцию, которая передается в качестве аргумента:

$scope.onButtonClick();

И вы можете сделать то же самое в своем HTML-шаблоне.

<img src="button.png" ng-click="onButtonClick()">

3) Будет ли ответ на 2) другим, если я планирую повторно использовать директива в другом месте?

Если я не планирую повторное использование; Я бы, вероятно, не использовал директиву.

I have a Button and when clicked and dragged it should move a completely unrelated Element.
Should I...

    A) Create one directive and influence template & behavior based on a passed attribute?
    B) Create two directives (one for the handle, one for the target Element)
    If so, it again poses the question of where to put the methods to handle the dragging?

Я бы выбрал пункт A, вероятно; передавая элемент, который нужно манипулировать в качестве аргумента в директиве. Тем не менее, это зависит от того, насколько я забочусь о возможности использования этой функциональности.

Все, что я говорю, должно считаться субъективным.