Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to test if event.target.hasClass() using angularJS and jqlite?

After a click pass the event to ctrl. I want to write a conditional that will return true if the element.target has the class modal-click-shield

Question:

How can I use .hasClass() with event.target using angulars' jqlite?

Problem:

Currently I'm getting a type error saying that:

$scope.exitModal = function(event){
        // Return to current page when exiting the modal, via UI.
        // After state return, should set focus on the matching link.
        var target = event.target;
        console.log(target.hasClass('modal-click-shield'));
});

Error:

TypeError: undefined is not a function

Html:

  <div class="modal-click-shield" ng-click="exitModal($event)">
     <div ui-view="pdw"  class="product-container"></div>
  </div>
like image 784
Armeen Harwood Avatar asked Jan 21 '15 00:01

Armeen Harwood


People also ask

How to check if event target has class?

To check if event. target has specific class, call the classList. contains() method on the target object, e.g. event. target.

How do I find my target class name for an event?

You can use jQuery to check for classes by name: $(event. target). hasClass('konbo');

What is angular jqLite?

jqLite is a tiny, API-compatible subset of jQuery that allows AngularJS to manipulate the DOM in a cross-browser compatible way. jqLite implements only the most commonly needed functionality with the goal of having a very small footprint. To use jQuery , simply ensure it is loaded before the angular. js file.


1 Answers

Your element from event.target is a regular HTMLElement, not the JQlite version. You need to do this to convert it:

angular.element(event.target);
like image 80
risto Avatar answered Sep 29 '22 08:09

risto