angular require parent controller without explicitly specifying name

Question

The common scenario of requiring a parent controller in a child directive shown here:

the Client directive requires the parent Server controller

  <div server>
    <div client></div>
  </div>



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

app.directive("server", function() {
  return {
   controller: function() {
      this.log = function(message) {
        console.log(message);
      };
    }
  };
});

app.directive("client", function() {
  return {
    require: "^server",
    link: function($scope, $elem, $attrs, serverCtrl) {
      serverCtrl.log("Hello, this is the client!");
    }
  };
});

What if I have a third directive directive called MegaServer

app.directive("MegaServer", function() {
  return {
   controller: function() {
      this.log = function(message) {
        console.log(message);
      };
    }
  };
});

MegaServer can also be a parent to "Client".

  <div server>
    <div client></div>
  </div>
  <div mega-server>
    <div client></div>
  </div>

How do I define my Client directive to require the parent controller if it can be of type either Server or MegaServer?

georgeawg · Accepted Answer · 2015-11-15 17:07:13Z

2

Have the other server publish its this on its $scope. Then have the client directive use either the optionally required serverCtrl or the $scope.serverCtrl.

angular.module("app").directive("otherServer", function() {
  return {
   controller: function($scope) {
      $scope.serverCtrl = this;       
      this.log = function(message) {
        console.log("otherServer: ", message);
      };
    }
  };
});

angular.module("app").directive("client", function() {
  return {
    require: "^?server",
    link: function(scope, elem, attrs, serverCtrl) {
      var ctrl = serverCtrl || scope.serverCtrl;
      if (ctrl) {  
         ctrl.log("Hello, from a client");
         ctrl.log("My scope.$id is " + scope.$id);
      };
    }
  };
});

Try it out on JSFiddle.

answered Nov 15, 2015 at 17:07

georgeawg

49k13 gold badges78 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

angular require parent controller without explicitly specifying name

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related