Что такое `priority` директивы ng-repeat, можете ли вы его изменить?

Angular Документация гласит: -

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

Директива ng-repeat, на мой взгляд, имеет более низкий приоритет, чем пользовательские директивы, в некоторых случаях использования, таких как динамический идентификатор и настраиваемая директива. Разрешает ли angular возиться с приоритетом директив, чтобы выбрать выполнение одного перед другим?

Ответы

Ответ 1

Да, вы можете установить приоритет директивы. ng-repeat имеет приоритет 1000, который на самом деле выше, чем пользовательские директивы (приоритет по умолчанию - 0). Вы можете использовать этот номер в качестве руководства для того, как настроить свой собственный приоритет на свои директивы по отношению к нему.

angular.module('x').directive('customPriority', function() {
    return {
        priority: 1001,
        restrict: 'E',
        compile: function () {
            return function () {...}
        }
    }
})

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

Ответ 2

AngularJS находит все директивы, связанные с элементом, и обрабатывает его. Этот параметр сообщает angular сортировать директивы по приоритету, поэтому директива с более высоким приоритетом будет скомпилирована или связана перед другими. Причиной этого варианта является то, что мы можем выполнить условную проверку на выходе предыдущей скомпилированной директивы.

В следующем примере сначала добавьте кнопку и только после добавления class к текущей кнопке:

Демо Fiddle

App.directive('btn', function() {
  return {
    restrict: 'A',
    priority: 1,
    link: function(scope, element, attrs) {
      element.addClass('btn');
    }
  };
});

App.directive('primary', function() {
  return {
    restrict: 'A',
    priority: 0,
    link: function(scope, element, attrs) {
      if (element.hasClass('btn')) {
        element.addClass('btn-primary');
      }
    }
  };
});