共谋似乎使控制器失效

transclusion seems to drop controller

本文关键字：控制器 失效 共谋      更新时间：2023-09-26

假设我有以下两个指令：

angular.module('test').directive('apiDirective', function (){
  return {
    restrict: 'A',
    controller: function () {
      this.awesomeFunction = function () {
        console.log("CHECK ME OUT BEING AWESOME");
      }
    }
  }
});
angular.module('test').directive('consumerDirective', function ($compile) {
  return {
    restrict: 'E',
    require: '?apiDirective',
    transclude: true,
    link: function (scope, element, attrs, controller, transcludeFn) {
      console.log('preLink controller: ', controller);
      transcludeFn(scope, function (tElem, tScope) {
        if (attrs.apiDirective === undefined) {
          element.attr('api-directive', '');
          $compile(element)(scope);
        }
        element.html(tElem);
        $compile(tElem)(tScope);
      });
      scope.consumerFunction = function () {
        console.log('trying to consume the awesome', controller);
        controller.awesomeFunction();
      }
    }
  }
});

以及以下html:

<consumer-directive ng-click="consumerFunction()"/>

当指令加载transclusion按预期发生时，将控制器设置为我的apiDirective控制器。然而，在consumerFunction中，控制器始终是null。为什么？我怀疑这与第二次编译有关？

完全删除第二个编译会导致指令无法正常呈现。为什么？

发生了什么，如何在不手动内联指令上的属性级控制器的情况下修复它？

plnkr演示：http://plnkr.co/edit/Lbh7T9FRg3nS6ERW4HtA

如果你想找到一些东西，你需要有一个指令的实例来寻找控制器（require只返回控制器的实例，而不是函数的工厂）。工作示例：http://plnkr.co/edit/XP3dV456M0No6nbx2zOW?p=preview

<body>
   <div ng-app="test">
      <consumer-directive api-directive ng-click="consumerFunction()">aaa</consumer-directive>
  </div>

相关文章：