38

角度文档说: -

DOM 的编译是通过调用 $compile() 方法来执行的。该方法遍历 DOM 并匹配指令。如果找到匹配项,则将其添加到与给定 DOM 元素关联的指令列表中。一旦确定了给定 DOM 元素的所有指令,它们就会按优先级排序并执行它们的 compile() 函数。

我认为 ng-repeat 指令的优先级低于自定义指令,在某些用例中,如动态 id 和自定义指令。角度是否允许修改指令的优先级以选择先执行一个指令?

4

2 回答 2

55

是的,您可以设置指令的优先级。ng-repeat优先级为1000,实际上高于自定义指令(默认优先级为 0)。您可以使用此数字作为指南,了解如何设置与它相关的指令的优先级。

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

优先级- 当在单个 DOM 元素上定义了多个指令时,有时需要指定应用指令的顺序。优先级用于在调用编译函数之前对指令进行排序。优先级被定义为一个数字。首先编译具有更高数值优先级的指令。具有相同优先级的指令的顺序未定义。默认优先级为 0。

于 2013-10-09T11:53:41.667 回答
12

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');
      }
    }
  };
});
于 2013-10-09T11:58:17.037 回答