1

on click on anchor how to toggle the child span element classes?

I already have one click function on my anchor: on click how to togle "glyphicon-chevron-down" to "glyphicon-chevron-up" ?

    <a ng-click="toggleList()">
     View More <span class="glyphicon glyphicon-chevron-down"></span>
    </a>

1 Answer 1

1

You could have

Markup

<a ng-click="toggleList()">
     View More <span class="glyphicon" ng-class="getClass()"></span>
</a>

Code

$scope.toggleList = function(){
   //other logic here
   $scope.isDown = !$scope.isDown; 
}

$scope.getClass = function(){
    return $scope.isDown ? 'glyphicon-chevron-down': 'glyphicon-chevron-up';
}
Sign up to request clarification or add additional context in comments.

3 Comments

It not works: by default it comes with 'up' but on click its not toggling!! :) <a ng-click="toggleList(isDown)"> View More <span class="glyphicon" class="glyphicon" ng-class="getClass(isDown)"></span> </a>
are we need to keep this $scope.getClass within the toggleList function ?
@Krish $scope is basically used for binding and then you can use scope variable on html directly in angular directives.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.