Javascript объект bool field магически меняет значение

Question

Я наткнулся на странное поведение объектов Javascript. логические поля, кажется, всегда получают «истинное» значение и никогда не могут быть изменены.

Я готовлю простую директиву разбивки на страницы с всплывающим сообщением.

<ul class="pagination">
  <li ng-repeat="button in buttons" ng-class="{active: button.isCurrent}">
    <a ng-click="button.click()" popover-template="'popover.html'" popover-placement="bottom" popover-is-open="button.showPageSelector" href="#">{{page.text}}</a>
  </li>
</ul>

Когда я получаю ответ от сервера, я создаю кнопки, используя следующий скрипт в .js:

// visiblePages is an array of Numbers
function buildPagination(scope, visiblePages) {
  scope.buttons = visiblePages.map(function (number) {
    return {
      text: number.toString(),
      isCurrent: number === scope.currentPage,
      showPageSelector: false,
      click: function () {
        if (this.isCurrent) {
          this.showPageSelector = !(this.showPageSelector);
        }
      }
    };
  });
}

Как видите, видимость всплывающего окна контролируется полем showPageSelector объекта кнопки. Теперь я просто хочу показать всплывающую подсказку, если нажата текущая страница, но она не отображается. Я включил отладчик и установил точку останова на функции click. похоже, что showPageSelector было установлено на true. Проблема в том, что showPageSelector используется только в этих 3 строках, и я ожидал, что это будет false. И каждый раз, когда я нажимаю пагинацию, я получаю один и тот же результат - назначение не меняет значение.

Почему это? Это угловая ошибка или проблема в Javascript? Проблема существует как в Firefox 61.0.2, так и в Chrome 67.0.3396.99, поэтому, я думаю, это не проблема с браузером