Brett Postin
Brett Postin

Reputation: 11375

Required dependency on parent directive

I have a <layout> directive that will consist of a number of <pane> elements.

Is it possible to create the pane directive such that it's instructions only apply when found within a <layout> element?

The documentation states:

require - Require another controller be passed into current directive linking function. The require takes a name of the directive controller to pass in. If no such controller can be found an error is raised.

Using require: '^layout', when a <pane> element is found outside a <layout> element an error does get thrown, however the dom element is still transformed. Can the directive be defined to restrict it's behaviour to the scope of a <layout> element?

What if I needed another pane directive with different instructions inside a <grid> element?

Upvotes: 0

Views: 228

Answers (1)

Mark Rajcok
Mark Rajcok

Reputation: 364677

Here is one way (maybe not the best way) to do it: define a controller on your layout directive, then optionally require it with ^? in your layout directive. In your link function, check to see if the layoutCtrl is defined:

require: '^?layout',
link: function(scope, element, attrs, layoutCtrl) {
   if(!layoutCtrl) return;  // do nothing if no layout

Fiddle.

Upvotes: 1

Related Questions