How to remove a class from neighboring elements on an event?

Question

Angular

How in Angular 1, when clicking on different elements, not only assign them a class, but at the same time remove it from all neighboring elements? In this example it is "flag-active-page"
Here is the css:

<div class="pagination">
        <ul>
          <li><a class="page" ng-click="toPage(1)" href="#">1</a></li>
          <li><a class="page flag-active-page" ng-click="toPage(2)" href="#">2</a></li>
          <li><a class="page" ng-click="toPage(3)" href="#">3</a></li>
          <li><a class="page" ng-click="toPage(4)" href="#">4</a></li>
          <li><a class="page" ng-click="toPage(5)" href="#">5</a></li>
          <li><a class="page-next" ng-click="nextPage()" href="#">...</a></li>
          <li><a class="page" ng-click="toPage(numPages())" href="#">{{numPages()}}</a></li>
        </ul>
      </div>

Answer 1

Well, only if ng-class is used like this:

function isActivePage(index) {
    return (vm.index === index);
}