Lai32290 Lai32290 - 1 month ago 14
AngularJS Question

How to define Angular directive must be a child of a specific directive in Angular?

I'm creating directive to

AngularJS
, how to can I configure it must be child of directiveA?

Like this example:

<my-modal>
<m-header>Header</m-header>
</my-modal>


m-header
must be child of
my-modal
, if not, occur some exception

Answer

You can use the require parameter to effort the require of a parent directive like the code below.

app.directive('mHeader', function() {
  return {
    require: '^^myModal',
    restrict: 'E',
    transclude: true,
    link: function(scope, element, attrs, myModalCtrl) {
      myModalCtrl.close();
    },
    templateUrl: 'my-header.html'
  };
});

Also, when using require, you can have access to the parent controllers, as you can see on myModalCtrl.