在 Angularjs 的 require 中使用多个指令答案

【问题标题】：Using multiple directives in require with Angularjs在 Angularjs 的 require 中使用多个指令
【发布时间】：2014-10-19 20:07:06
【问题描述】：

我有需要访问多个指令控制器方法的情况。

我可以使用 require 从父指令访问方法，如下所示：

    require:"^parentDirective"

但我还需要在单独的指令（不是父级）中访问一个方法，文档对use an array of strings 说如下：

    require:["^parentDirective","directiveTwo"]

但这样做会导致错误，尽管这两个指令都已编译到 DOM。

我错过了什么吗？

这是我的指令：

    angular.module('testModule', ['parentModule'], function () {
    }).directive('testDirective', function() {
        return {
            restrict: 'AE',
            templateUrl: 'testTemplate.tpl.html',
            scope: {
                value1: "=",
                value2: "="
            },  
            require:['^parentDirective','otherDirective'],
            controller: function($scope,$modal,socketConnection) {

                if(case_x == true){
                    $scope.requiredController_1.ctrl1Func();
                }
                else if(case_x == false){
                    $scope.requiredController_2.ctrl2Func();
                }


            },
            link: function(scope,element,attrs,requiredController_1,requiredController_2){

                scope.requiredController_1 = requiredController_1;
                scope.requiredController_2 = requiredController_2;

            }

        };

    });

【问题讨论】：

你能把所有三个指令放在一个小提琴或 plunker 中吗？我唯一看到的错误是在链接函数中，该函数接收一个控制器数组，而不是每个控制器单独（除非改变了）。
Here's a plunker 我正在尝试做的事情，但它似乎仍然无法正常工作，我不确定为什么。

标签： javascript angularjs angularjs-directive require

【解决方案1】：

我认为这接近你想要的（希望如此）：

http://plnkr.co/edit/WO6SROdVFOYlR22JQJPb?p=preview

以下是一些想法：

我认为controller: function () {} 是在向下的路上执行的，而link: function () {} 是在向上的路上执行的（这发生在它沿着 DOM 树向下走之后），这意味着你需要移动你的代码这取决于从指令控制器到指令链接功能的其他控制器。
使用require 的指令只能要求父元素（使用^）或当前元素上的指令。最初，您的 html 中的元素都是兄弟姐妹。如果需要这种情况，您需要将所有兄弟姐妹包装在第四个指令中，它们都是“require”。

当您执行require: [] 时，会将一个数组传递给链接函数。因此：

link: function(scope, element, attrs, controllers) {
  var parent1 = controllers[0];
  var other = controllers[1];
}

这能回答一切吗？

【讨论】：

感谢您的洞察，我面临的问题有两个，首先我试图访问在不相关模块（不是父模块或调用该方法的模块）中找到的指令中的方法，我不知道，这是不允许的。我的第二个问题是我没有在链接函数中正确访问控制器元素。谢谢你的回答:)

【解决方案2】：

require 语句后面需要一个逗号

require:['^parentDirective','otherDirective'], //<--- right there

这里有一个 plunker 来显示它在需要多个指令时工作

【讨论】：

嗨，Dan 感谢您的回复，这是我的错字，工作代码实际上有一个逗号，我已经更改了示例代码以修复该错字。还要感谢您的 plunkr 示例，它按预期工作，但是在您的示例中，所有指令都包含在一个模块中，在我的示例中，require 中调用的两个指令都存在于示例模块之外，因此尽管您的示例有效，但它仍然对我没有帮助情况。
@user1005240 好吧。根据我从您的问题中了解到的情况，您似乎正在尝试嵌套模块，根据文档，这是明确不允许的：docs.angularjs.org/api/ng/directive/ngApp 它说AngularJS applications cannot be nested within each other
据我所知，我并没有完全嵌套它们，我正在创建的是一个带有多个模块的大型应用程序，这些模块加载在其中，其中一些模块作为依赖项相互链接这很好，允许数据通过不同的模块向下传递。其中一些模块包含我需要在其模块控制器之外访问的指令方法，当我“需要”仅一个字符串（指令名称）但当我将字符串数组格式用于多个“需要”指令时，我可以这样做不起作用。