angular directive - scope undefined inside function

Question

I can't seem to reach the link function scope variable from inside a function in my directive. The "elem" variable is defined, but the scope isn't. Why is that??

Here's my directive:

function contextMenu($document){
  return {
    scope: {
      target: '=',
    },
    restrict: 'A',
    link: function(scope, elem, attr) {
      elem.bind('contextmenu',handleRightClick);
      function handleRightClick(event) {
        // do something with scope (scope is undefined)
      }
    }
  }
};

How can I user the scope variable?

Thanks!

Uri

EDIT1:

I found I can use this to pass the scope to the function: Passing parameters to click() & bind() event in jquery?, but this still doesn't explain why the scope variable is undefined.

EDIT2:

For completeness sake, this is how my directive is set up:

app.js

angular
  .module('myModule', [])
  .directive('contextMenu', ['$document', components.contextMenu])

and in the html:

<div context-menu target="testObject">

scope should be accessible. Do a console log of scope and check. Giving breakpoint inside function and verifying for scope might be undefined. — Sai
– Sai, Commented Feb 4, 2015 at 8:56

mwiegboldt · Accepted Answer · 2015-02-04 09:44:18Z

0

Make sure you are using the directive correctly. Since you didn't include the use of the directive in your template, I hope you used it something like this:

    <div context-menu target="something"></div>

Then I am confused about the setup of your directive. Try this:

    MyDirectiveModule.directive('contextMenu', function(){
        return {
            restrict: 'A',
            scope: {
                target: '@'
            },
            link: function(scope, element){
                console.log(scope);
                // don't use $scope!
            }
        };
    });

Make sure to use scope instead of $scope in the link: part.

answered Feb 4, 2015 at 9:44

mwiegboldt

2,7602 gold badges19 silver badges22 bronze badges

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

4 Comments

Uri Klar Over a year ago

Thanks, I added the directive setup code. And, yes, i'm using scope and not $scope.

mwiegboldt Over a year ago

can you make a plunkr?

Uri Klar Over a year ago

I tried recreating in a plunkr but it won't re create. The actual directive is nested inside some other directives in a bit of a complicated structure. Anyway, thanks for the help, if i'll manage to recreate i'll update the question.

mwiegboldt Over a year ago

Okay, maybe the complicated setup was the problem then? Good luck to you!

Collectives™ on Stack Overflow

angular directive - scope undefined inside function

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related