Question

我正在创建ng-repeat并使用ng-model更改可见元素的数量，这样可以正常工作。我还使用ng-click和ng-class创建了一个分页，以及我遇到问题的地方。

我在控制器的范围内定义了一些变量，例如金额限制，总页数，当前页面如下：

// definitions
$scope.clients;
$scope.clientsAmount;

// amount of visible clients
$scope.limitArray = [8,12,16];
$scope.clientsLimit = 8;

// function to get the amount of pages
function getPages(els, limit) {
    // get the total pages considrering the amount of elements
    $scope.totalPages = Math.ceil(els/limit);
    $log.log( 'get - total => ', $scope.totalPages );
}

然后我有一些功能可以转到下一页/上一页。在页面加载时，这些工作正常，但是当我更改clientsLimit数量时，即使更新了控制器的范围值（使用$ watch我再次使用clientsLimit的新值调用getPages函数）但是当我单击按钮时使用ng-click指令不会更改页面的值。该参数用于检查这是最后/第一个或下一个/上一个按钮。

// NEXT BUTTON
    $scope.nextBtn = function(param){
        $log.log( 'value => ',  value );
        // check if this is not the last page and the param is true
        // go to the next page
        if( $scope.currentPage !== $scope.totalPages && param ) {

            $scope.currentPage++;

        } else if (!param) {

            $scope.currentPage = $scope.totalPages;

        }// conditional end

    };// next button end

// PREVIOUS BUTTON
    $scope.prevBtn = function(param){

        // check if this is not the first page and the param is true
        // go to the preivious page
        if( $scope.currentPage !== 1 && param ) {

            $scope.currentPage--;

        } else if ( !param ) {

            $scope.currentPage = 1;

        }// conditional end

    };// previous button end

这是HTML

<li ng-class="firstPageCheck()">
  <a href aria-label="First" ng-click="prevBtn(false)">
    <span aria-hidden="true">First</span>
  </a>
</li>

<li ng-class="firstPageCheck()">
  <a href aria-label="Previous" ng-click="prevBtn(true)">
    <span aria-hidden="true">Previous</span>
  </a>
</li>

<li ng-class="lastPageCheck()">
  <a href aria-label="Next" ng-click="nextBtn(true, value=totalPages)">
    <span aria-hidden="true">Next</span>
  </a>
</li>
<li ng-class="lastPageCheck()">
  <a href aria-label="Last" ng-click="nextBtn(false, value=totalPages)">
    <span aria-hidden="true">Last</span>
  </a>
</li>

正如我所说，ng-class和ng-click没有反映控制器范围的变化。

这是一个包含文件和JSON数据的插件：

http://plnkr.co/edit/eVSW449vJ5cv6WWvyJhc?p=info

=======================================

修改

您好。基本上这是＆＃34; 我是一个白痴编辑＆＃34; ：P。事实证明我正在添加多个控制器实例，因此选择模型只更新控制器实例，而其他（是......在某些时候，我包括最多3：S）保持设置的值在运行时间。

这是一个更新的Plunker链接，只有一个控制器实例，所有内容都可以正常使用： http://plnkr.co/edit/eVSW449vJ5cv6WWvyJhc

Answer 1

我查看了你的代码，我没有找到import angular-ui，因为你使用了分页。退房：W3Schools 简单的例子：

 'http://plnkr.co/edit/xxjIBw71hDp9AHSrEhfp?p=preview

AngularJS更新控制器

1 个答案: