Get class name with click using angular

Question

I want to get the class name of the div that clicked. I have some div tags as below.

<div id="car" class="ams-product car" data-ng-class="{ 'car-inactive ams-deactivated-product': carInactive() }" data-ng-click='getClass(); hide(); loadCarModule()'>
    <div class="ams-product-inner">
        <img class="product-img" data-ng-src="{{ carValidation()}}">
        <h3>Car</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim</p>
        <a href="#" class="add-this-product" data-ng-class="{ 'car-inactive': carInactive() }">+</a>
    </div>
</div>

I need a class name or id of the top outer div (div id = "car"). Note that there are three such divs. So I want to know which div was clicked.

Answer 1

If you want to check that the classes are set in the element that is applied with ng-class, you can simply check the variable / function that was used to enable and disable ng-class, for example,

 $scope.getClass = function() {

      //if $scope.carInactive() is true then 
      //car-inactive & ams-deactivated-product classes apply to the element.

      console.log($scope.carInactive());
 };

Or you can use the old JavaScript method to get the class from the clicked element,

ng-click $event ,

...data-ng-click='getClass($event); hide(); loadCarModule()'>

 $scope.getClass = function(event) {
     console.log(event.srcElement.className);
 };

, , , first one, , div, ng-click , , div, h3, h3