AngularJS缺少所需的控制器

我想创建两个具有以下结构的指令：

<div ng-app="myApp">
    <div ui-foo="test">
        <div ui-bar="test2"></div>
    </div>
</div>

我遇到的问题称为

error/$compile/ctreq

（

无法找到指令“uiBar”所需的控制器“uiFoo！”

），相关文档可在此处找到（）。我知道，有点平淡无奇

这似乎不能解决我的问题

我已经为此创建了一个JSFIDLE，您可以在这里找到它

---

谢谢

正如错误所说，您缺少

uiFoo

指令上的控制器

当您使用

require:^uiFoo

时，它告诉Angular您希望在名为

uiFoo

的指令中访问控制器

您没有在该指令中定义控制器，因此出现了错误

只需定义控制器：

angular.module('ui', []).directive('uiFoo', 
    function() {
      return {
        restrict: 'A',
        link: function($scope, element, attrs) {
            $scope.message = function() {
                alert(1);
            };
        },
          controller: function($scope) {
              this.message = function () {
                  alert("works!");
              }
          }
      };
    }
  )

---

.

正如错误所说，您缺少

uiFoo

指令上的控制器

当您使用

require:^uiFoo

时，它告诉Angular您希望在名为

uiFoo

的指令中访问控制器

您没有在该指令中定义控制器，因此出现了错误

只需定义控制器：

angular.module('ui', []).directive('uiFoo', 
    function() {
      return {
        restrict: 'A',
        link: function($scope, element, attrs) {
            $scope.message = function() {
                alert(1);
            };
        },
          controller: function($scope) {
              this.message = function () {
                  alert("works!");
              }
          }
      };
    }
  )

---

.

$

在作用域上，而不是在元素上。删除它并不能解决任何问题，它只是一种命名约定。

link

函数只是按特定顺序注入参数。

$

在作用域上，而不是在元素上。删除它并不能解决任何问题，它只是一种命名约定。

link

函数只是按照特定的顺序注入参数。嗯，我认为通过填充

范围

，它将充当控制器。现在有道理了。不过，文档可能需要稍加润色。：）谢谢你的帮助@阿德里安马尔，我的荣幸。我同意文档。嗯，我认为通过填写

范围

，它将充当控制器。现在有道理了。不过，文档可能需要稍加润色。：）谢谢你的帮助@阿德里安马尔，我的荣幸。我同意文件。