AngularJS Directive Transclude parent scope

Question

I'm working on a directive and I'm using transclude so the inner element of the directive use is used inside it.

Let's say that this is my directive's view:

<div>
  <div ng-repeat="opt in options">
    <ng-transclude></ng-transclude>
  </div>
</div>

Directive:

app.directive("myDirective", function(){
    return {
        restrict: "E",
        transclude: true,
        templateUrl: 'my-directive.html',
        scope: {
          options: '='
        }
    };
  });

And a simple use of it:

<my-directive options="someOptions">
     <p>{{someObject[$parent.opt]}}</p>
</my-directive>

This works just fine. My problem with this solution is that that $parent.opt is not very readable and clear... Is there any other option?

Thanks

Answer 1

Your directive seems to be a very specific one.
How about passing the parent to the directive too?

<my-directive options="someOptions" object="someObject"></my-directive>

---

In the directive:

<div>
  <div ng-repeat="opt in options">
    <p>{{object[opt]}}</p>
  </div>
</div>

And then add object: '<' in your isolated scope declaration.