javascript - 在 AngularJS 中获取指令名称

Question

我有一个 Angular 指令。在 link 函数中，我执行以下操作:

link: function(scope, element, attrs) {
    ...
    element.data('startY', value);
    ...
}

我想做的是用指令的名称加上前缀'startY'，而不是对名称进行硬编码。我想动态获取名称。

有什么办法可以做到这一点吗？ Angular 是否提供了反射(reflect)它的方法？像这样的东西:

link: function(scope, element, attrs) {
    ...
    element.data(this.$name + '-startY', value);
    ...
}

如果没有，建议选择 data() 键以避免冲突的最佳实践是什么？

Answer 1

如 AngularJS source code 中所示，指令的名称是在指令选项所在的对象文字的上下文中分配的。然而，链接函数无法访问对象字面量的上下文 this，因为它将被传输到编译函数，在编译过程发生后它将被返回并调用。

要在链接函数中获取名称，您可以遵循以下任何建议:

[ 1 ] 创建一个可以保存对对象文字(指令选项)的引用的变量。

.directive('myDirective', function() {
  var dir = {
    link: function(scope, elem, attr) {
      console.log(dir.name);
    }
  };
  return dir;
});

[ 2 ] 您还可以使用编译函数获取指令的名称，因为它是在指令选项的上下文中调用的。

.directive('myDirective', function() {
  return {
    compile: function(tElem, tAttr) {
      var dirName = this.name;
      return function(scope, elem, attr) { /* link function */ }
    }
  };
});