Question

我使用JHipster生成了我的项目，我的一个实体使用了pagination（）。一切都工作正常，但我想包括页面大小选项和分页。但我在UI Bootstrap文档中没有看到任何选项。因此，我将uib-pagination指令包装在自定义指令中。

这是指令：

'use strict';
//angularJS directive for Spring Pagination with page size control.

angular.module('myApp')
    .directive('springPagination', function(){
        return{
            restrict: 'AE',
            replace: true,
            scope: true,
            templateUrl: 'scripts/components/pagination/spring-pagination.html',
            controller: 'my_entity_controller'
        };
    })

这是模板（HTML）：

<div class="row row-sm-height" id="pagination_div">
    <div class="col-md-6 pagination_panel col-xs-12" id="pagination_left">
        <uib-pagination class="pagination-md" total-items="totalItems"
            ng-model="page" ng-change="loadAll()" rotate="false"
            boundary-links="true" boundary-link-numbers="true" max-size="7"></uib-pagination>
    </div>
    <div class="col-md-6 pagination_panel col-xs-12" id="pagination_right">
        <div class="row pagination_panel_row">
            <div class="col-xs-4 pagination_panel_item">
                <label>Items Per Page:</label>
            </div>
            <div class="col-xs-4 pagination_panel_item">
                <input class="form-control" placeholder="Items per Page"
                    type="number" min="5" max="100" ng-model="newItemPerPage"></input>
            </div>
            <div class="col-xs-4 pagination_panel_item">
                <button type="button" class="btn btn-info"
                    ng-click="setItemPerPage()">Set</button>
            </div>
        </div>
    </div>
</div>

当我点击我的自定义指令上的项目，例如页码或将页面大小设置为50时，AngularJS能够获取新值并向服务器发送REST请求，并使用新数据发送服务器响应。但是，我的表格保持不变，没有任何更改。

有人可以给我一些指示吗？为什么我的数据没有像没有自定义指令那样更新？也许ui.bootstrap.pagination有一个内置选项来显示页面大小，这样我就不需要创建一个自定义指令，这样可以减轻麻烦？

Answer 1

傻傻的我。事实证明我的方法是可行的，但我只是忘了在布尔上使用撇号。所以基本上：

 scope: true

应该是：

 scope: 'true'

我很确定我看到了其他使用

的教程

范围：true

没有撇号。但是哦，至少我的问题已经解决了......

另外，无需放置控制器和替换选项（好吧，至少对于我的用例我不喜欢＆＃39;我需要）因为我希望我的指令从我应用此自定义指令的html共享相同的控制器。

当uib-pagination包含在另一个指令中时，AngularJS表数据不会更新？

1 个答案: