在我的指令的require属性中找不到控制器

Question

我有这个HTML：

<nav>
  <ul rf-hover-wrapper>
    <li rf-hover-child rf-on-hover-class="hover">Home</li>
    <li rf-hover-child rf-on-hover-class="hover">About us</li>
    <li rf-hover-child rf-on-hover-class="hover">Contact</li>
  </ul>
</nav>

我的指令和控制人员：

var app = angular.module('myApp', []);

app.directive('rfHoverWrapper', function() {
      return {
        restrict: 'A',
        controler: function (){
          this.onMouseOver = function(el, addClass) {
             el.bind('mouseover', function() {
                el.addClass(addClass);
             });
          };

        }
      }

  });

app.directive('rfHoverChild', function() {
  return {
    require: "^rfHoverWrapper",//here i'm requiring rfHoverChild controller above
    restrict: 'A',
    link: function(scope, iElement, attrs, rfHoverWrapperController) {
       console.log(rfHoverWrapperController);
    }
  }
});

我收到了这个错误：

  

错误：[$ compile：ctreq]控制器'rfHoverWrapper'，需要   指令'rfHoverChild'，找不到！

为什么找不到这个？我见过很多例子，他们几乎都是以这种方式工作的。

Answer 1

你的指令是一个错字。 controler应为controller。由于输入错误，控制器从未注册，因此解释了您所看到的错误。