Angular js ng-class不起作用

Question

我正在尝试对我的信息列表进行分页。 当前，有两个按钮是previous和next按钮。 previous按钮在工作，但next按钮在工作，但仍在继续工作。 实际上，我希望在到达列表末尾时将其禁用。 但是现在我仍然可以单击下一步按钮。

我该如何解决这个错误？

这是我的分页代码：

<div ng-show="filteredItems > 0">

<ul class="pagination" page="currentPage">
    <li ng-class="{disabled: currentPage == 1}">
        <a href ng-click="prevPage()">« Prev</a>
    </li>

    <li ng-class="{disabled: currentPage == totalItems - 1}">
        <a href ng-click="nextPage()">Next »</a>
    </li>
  </ul>
</div>

这是我的controller.js代码：

$scope.nextPage = function () {
    if ($scope.currentPage < $scope.totalItems - 1) {
            $scope.currentPage++;
            console.log($scope.totalItems);
        }
    };
}

Answer 1

这是一个正在工作的家伙。

将ngClick从a移至li 或将ngClass移至a 。 对于第一种情况：

<li ng-class="{disabled: currentPage == totalItems - 1}" ng-click="nextPage()">
    <a>Next »</a>
</li>

假设您有一个定义为disabled的类。 如果不是，则定义如下：

.disabled {
    opacity: 0.5;
    pointer-events: none;
}

Answer 2

尝试使用totalitems.length - 1更改totalitems - 1 totalitems.length - 1 。

Answer 3

试试这个ng-class =“ {'disabled'：currentPage == totalItems-1}