Как добавить класс в div родителя родителя в Angular JS?

Question

У меня есть динамически список строили тестов:

<script id="TestsTemplate" type="text/ng-template"> 
     <article class="tests-main"> 
      <section class="tests"> 
       <div class="test" ng-repeat="test in tests"> 
        <p>Question {{ test.number }}:</p> 
        <div ng-repeat="answer in test.answers"> 
         <div ng-repeat="(key, value) in answer"> 
          <p><button ng-click="processAnswer(value, $event)" class="btn" >&#9675 {{ key }}</button></p> 
         </div> 
        </div> 
       </div> 
     </article> 
    </script> 

, и я хочу, чтобы добавить класс к DIV (класс = «тест»), в котором была нажата кнопка.

Я знаком только с JQuery, и я могу думать только такой подход:

$scope.processAnswer = function(isRight, event) {  
    isRight ? $scope.count++ : $scope.count--; 
    event.target.parentNode.parentNode.parentNode.addClass('hide'); 
} 

Как сделать это в угловом стиле?

РЕДАКТИРОВАТЬ: Мое решение:

ng-class использования и $index:

<div ng-class="($index==selectedIndex) ? 'hide' : 'test'" ng-repeat="test in tests"> 

Контроллер:

$scope.selectedIndex = -1; 
$scope.processAnswer = function(isRight, index) { 
     isRight ? $scope.count++ : $scope.count--; 
     $scope.selectedIndex = index - 1; //$index starts at 0; 
    } 

, где находится indextest.number

Answer 1

Возможно, вы можете использовать ng-class, чтобы применить класс, когда вы устанавливаете значение boolean на true. Например:

<div class="test" ng-repeat="test in tests" ng-class="{'hide' : onProcessAnswer}"> 

и в контроллере

$scope.onProcessAnswer = false; 
$scope.processAnswer = function(isRight, event) { 
     ... 
     $scope.onProcessAnswer = true; 
     ... 
} 

Answer 2

попробовать этот

$(".test").addClass("YourClassHere"); 

Answer 3

На мой взгляд, Угловая библиотека сделать кодеры сделать менее Dóm вариант.

Вы можете использовать функцию привязки данных для большинства запросов.

Если вы хотите получить родительский элемент и добавить атрибут, просто используйте jQuery или чистый javascript.

Answer 4

Попробуйте как этот

angular.element(event.target).parent().parent().addClass("hide"); 

манипулируя йот в HTML не рекомендуется. Вы должны делать свои манипуляции с dom только в директивах.

Answer 5

Попробуйте, как простой

$element.parent().addClass('default-class');