0

I have a directive that transcludes some HTML to provide a faux context menu. The usage is as such:

<div id="my-element">
    My content
    <context-menu get-offset="getOffset($event)">
       <ul>
           <li>
               <a href="" ng-click="action()">{{ label }}</a>
           </li>
       </ul>
    </context-menu>
</div>

This will bind an event listener to #my-element which on right click will show contents of context-menu to whichever offset $scope.getOffset returns.

Everything works, except the interpolated string {{ label }} is not expanded. Let's say the value of $scope.label is 'ABC'. Instead of seeing "ABC", you see "{{ label }}". However, ngClick seems to be bound correctly.

Please see this plunkr for the code & demo: http://plnkr.co/edit/QDVAHkhrfsNpRcjTwCpM?p=preview

Why is this?

user1569339
  • 683
  • 8
  • 20

1 Answers1

3

The events aren't triggering a $digest cycle. Add this line to the end of showContextMenu():

transcludeScope.$digest();

(You can trigger it using any scope, really)

HankScorpio
  • 3,612
  • 15
  • 27