Skip to content
This repository was archived by the owner on May 29, 2019. It is now read-only.

feat(pager): move to separate component #4935

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions src/pager/docs/demo.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<div ng-controller="PagerDemoController">
<h4>Pager</h4>
<uib-pager total-items="totalItems" ng-model="currentPage"></uib-pager>
</div>
4 changes: 4 additions & 0 deletions src/pager/docs/demo.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
angular.module('ui.bootstrap.demo').controller('PagerDemoCtrl', function($scope) {
$scope.totalItems = 64;
$scope.currentPage = 4;
});
26 changes: 26 additions & 0 deletions src/pager/docs/readme.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
A lightweight pager directive that is focused on providing previous/next paging functionality

### Pager Settings ###

Settings can be provided as attributes in the `<uib-pager>` or globally configured through the `uibPagerConfig`.
For `ng-model`, `total-items`, `items-per-page` and `num-pages` see pagination settings. Other settings are:

* `align`
_(Default: true)_ :
Whether to align each link to the sides.

* `previous-text`
_(Default: '« Previous')_ :
Text for Previous button.

* `next-text`
_(Default: 'Next »')_ :
Text for Next button.

* `template-url`
_(Default: 'template/pagination/pager.html') :
Override the template for the component with a custom provided template

* `ng-disabled` <i class="glyphicon glyphicon-eye-open"></i>
:
Used to disable the pager component
37 changes: 37 additions & 0 deletions src/pager/pager.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
angular.module('ui.bootstrap.pager', ['ui.bootstrap.pagination'])

.constant('uibPagerConfig', {
itemsPerPage: 10,
previousText: '« Previous',
nextText: 'Next »',
align: true
})

.directive('uibPager', ['uibPagerConfig', function(pagerConfig) {
return {
restrict: 'EA',
scope: {
totalItems: '=',
previousText: '@',
nextText: '@',
ngDisabled: '='
},
require: ['uibPager', '?ngModel'],
controller: 'UibPaginationController',
controllerAs: 'pagination',
templateUrl: function(element, attrs) {
return attrs.templateUrl || 'uib/template/pager/pager.html';
},
replace: true,
link: function(scope, element, attrs, ctrls) {
var paginationCtrl = ctrls[0], ngModelCtrl = ctrls[1];

if (!ngModelCtrl) {
return; // do nothing if no ng-model
}

scope.align = angular.isDefined(attrs.align) ? scope.$parent.$eval(attrs.align) : pagerConfig.align;
paginationCtrl.init(ngModelCtrl, pagerConfig);
}
};
}]);
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
describe('pager directive', function() {
var $compile, $rootScope, $document, $templateCache, body, element;
beforeEach(module('ui.bootstrap.pagination'));
beforeEach(module('uib/template/pagination/pager.html'));
beforeEach(module('ui.bootstrap.pager'));
beforeEach(module('uib/template/pager/pager.html'));
beforeEach(inject(function(_$compile_, _$rootScope_, _$document_, _$templateCache_) {
$compile = _$compile_;
$rootScope = _$rootScope_;
Expand Down Expand Up @@ -54,7 +54,7 @@ describe('pager directive', function() {
});

it('exposes the controller on the template', function() {
$templateCache.put('uib/template/pagination/pager.html', '<div>{{pagination.text}}</div>');
$templateCache.put('uib/template/pager/pager.html', '<div>{{pagination.text}}</div>');

element = $compile('<uib-pager></uib-pager>')($rootScope);
$rootScope.$digest();
Expand Down
4 changes: 0 additions & 4 deletions src/pagination/docs/demo.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,4 @@ <h6><code>boundary-link-numbers</code> set to <code>true</code> and <code>rotate
<uib-pagination total-items="bigTotalItems" ng-model="bigCurrentPage" max-size="maxSize" class="pagination-sm" boundary-link-numbers="true" rotate="false"></uib-pagination>
<pre>Page: {{bigCurrentPage}} / {{numPages}}</pre>

<hr />
<h4>Pager</h4>
<uib-pager total-items="totalItems" ng-model="currentPage"></uib-pager>

</div>
25 changes: 0 additions & 25 deletions src/pagination/docs/readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -72,28 +72,3 @@ Settings can be provided as attributes in the `<uib-pagination>` or globally con
* `template-url`
_(Default: 'uib/template/pagination/pagination.html')_ :
Override the template for the component with a custom provided template

### Pager Settings ###

Settings can be provided as attributes in the `<uib-pager>` or globally configured through the `uibPagerConfig`.
For `ng-model`, `total-items`, `items-per-page` and `num-pages` see pagination settings. Other settings are:

* `align`
_(Default: true)_ :
Whether to align each link to the sides.

* `previous-text`
_(Default: '« Previous')_ :
Text for Previous button.

* `next-text`
_(Default: 'Next »')_ :
Text for Next button.

* `template-url`
_(Default: 'template/pagination/pager.html') :
Override the template for the component with a custom provided template

* `ng-disabled` <i class="glyphicon glyphicon-eye-open"></i>
:
Used to disable the pager component
36 changes: 0 additions & 36 deletions src/pagination/pagination.js
Original file line number Diff line number Diff line change
Expand Up @@ -221,40 +221,4 @@ angular.module('ui.bootstrap.pagination', [])
};
}
};
}])

.constant('uibPagerConfig', {
itemsPerPage: 10,
previousText: '« Previous',
nextText: 'Next »',
align: true
})

.directive('uibPager', ['uibPagerConfig', function(pagerConfig) {
return {
restrict: 'EA',
scope: {
totalItems: '=',
previousText: '@',
nextText: '@',
ngDisabled: '='
},
require: ['uibPager', '?ngModel'],
controller: 'UibPaginationController',
controllerAs: 'pagination',
templateUrl: function(element, attrs) {
return attrs.templateUrl || 'uib/template/pagination/pager.html';
},
replace: true,
link: function(scope, element, attrs, ctrls) {
var paginationCtrl = ctrls[0], ngModelCtrl = ctrls[1];

if (!ngModelCtrl) {
return; // do nothing if no ng-model
}

scope.align = angular.isDefined(attrs.align) ? scope.$parent.$eval(attrs.align) : pagerConfig.align;
paginationCtrl.init(ngModelCtrl, pagerConfig);
}
};
}]);