Using multiple directives in a query using Angularjs

Question

I have a situation where I need access to several controller methods.

I can access the method from the parent directive using this:

require:"^parentDirective" 

but I also need to access the method in a separate directive (not the parent), the documentation says to use an array of strings :

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

but errors occur, although both directives were compiled into the DOM.

Did I miss something?

here is my directive:

  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; } }; }); 

Answer 1

I think this is close to what you want (hopefully):

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

Here are some thoughts:

• I think controller: function () {} is executed on the way down, whereas link: function () {} is executed on the way back (which happens after it goes through the DOM tree), which means you need to move own code that depends on other controllers from a directory controller to a directory link function.

• Directives using require may require only directives for the parent elements (using ^ ) or the current element. In your html, initially, your elements are all brothers and sisters. If so, you need to wrap all the siblings in the fourth directive so that they are all “ require ”.

• When you execute require: [] , the array is passed to the communication function. Consequently:

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

Will this answer all?

Answer 2

You need a comma after the require statement

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

Here's a plunker to show his work, requiring a few directives