1

I have a div with an ng-click where I call following function:

$scope.toggleLog = function($event){
     $event.currentTarget.slideToggle()
 }

When I look in the debugger the $event.currentTarget is pointing towards my div, so seems fine. However, the slideToggle() function is undefined. I have included JQuery. The $event is a jquery object and so is the currentTarget. So why am I not able to call any JQuery related functions on it?

2 Answers 2

4

instead of this line

$event.currentTarget.slideToggle()

Try using this way,

angular.element($event.currentTarget).slideToggle();

angular.element is an alias of jQuery in angularjs

If jQuery is available, angular.element is an alias for the jQuery function. If jQuery is not available, angular.element delegates to Angular's built-in subset of jQuery, called "jQuery lite" or "jqLite."

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

3 Comments

Thanks, that works! Is there any advantage on using angular.element over wrapping the element between $() ?
I updated my answer, also please visit the link i included for better understanding. :D
When i read through the documentation there, i didn't see slideToggle() function available with jqLite, so in your case you must have jQuery available :-(
1

$event.currentTarget is pointing to DOM element, not a jQuery object. Wrap it up in jQuery and then invoke slideToggle.

$($event.currentTarget).slideToggle();

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.