Question

我的问题与目录及其两个属性有关。

链接功能的参数不具有$符号作为前缀的原因是什么？

e.g

link: function (scope, element, attrs, ctrl) {
                        scope.$watch("item.quantity", function () {
                            ctrl.updateTotal();
                        });
                    }

与控制器属性相反：

controller: function ($scope, $element, $attrs) {

                    }

我知道第一个是链接函数，因此没有$符号。

但为什么要有所作为呢？是否部分原因是您可以在指令中创建自己的scope，因此范围并不一定意味着与控制器的$scope相关？

这可以解释scope参数，但我无法想到有关其他参数的任何解释。

提前致谢。

Answer 1

按照惯例，$前缀不用于$ injector注入的函数。因此link: function (scope, element, attrs [,ctrl])不会被注入。它总是以相同的顺序具有相同的参数。

在处理依赖注入提供参数的函数时，必须使用$scope，否则不会注入。

<强> TL; DR

这或多或少会让Angular学习者感到困惑，但必须为某些功能使用定位参数（如postLink）至关重要。

其他信息和链接

对于那些想要了解具体细节的人，我建议阅读AngularJS指南的以下章节：

Creating Directives that Communicate，请阅读Summary。
Comprehensive Directive API

在后一个链接中，您可以看到包含一些带有定位参数的方法的指令定义对象（请注意，在此示例中，有许多选项在组合中没有意义）：

myModule.directive('directiveName', function factory(injectables) {
  var directiveDefinitionObject = {
    template: function(tElement, tAttrs) { ... },
    templateUrl: function(tElement, tAttrs) { ... },
    // controller: function($scope, $element, $attrs, $transclude, otherInjectables) { ... },
    compile: function compile(tElement, tAttrs, transclude) {
      return {
        pre: function preLink(scope, iElement, iAttrs, controller) { ... },
        post: function postLink(scope, iElement, iAttrs, controller) { ... }
      }
    },
    link: {
      pre: function preLink(scope, iElement, iAttrs, controller) { ... },
      post: function postLink(scope, iElement, iAttrs, controller) { ... }
    }
    // or
    link: function postLink(scope, iElement, iAttrs, controller) { ... }
  };
  return directiveDefinitionObject;
});

如果在DDO中使用控制器函数（指令定义对象的缩写），将注入参数（因此前缀为$）：

// ... somewhere in the DDO ...
controller: function($scope, $element, $attrs, $transclude, otherInjectables) { ... },

您可以找到“特殊”注射剂here

的文档

当然，除了提到的具有定位参数的函数之外，例如$ animate enter()，leave()等。

Answer 2

Angular只是使用这些特定对象作为参数调用方法。如果我们想要（但当然它违反惯例），我们可以将这些参数命名为我们想要的任何名称，只要我们保留它们被使用的顺序即可。

AngularJS - 指令 - 以下语法背后的原因是什么？

2 个答案: