Как добавить «ALL» в качестве метки и totalItems в качестве значения в поле выбора paginationPageSizes для добавления, как [25, 50, 75] в сетке пользовательского интерфейса, используя angularjs

Вы можете настроить их параметры, но не полностью гладкие. Я создал Plunkr, демонстрируя возможное решение.

Сначала вы изменяете объект paginationPageSizes так, как вы уже делали

paginationPageSizes: [
  {label: '25', value: 25},
  {label: '50', value: 50},
],

Чтобы добавить ALL, вы можете нажать это значение после получения ваших данных.

$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json')
.success(function (data) {
  $scope.gridOptions1.data = data;
  $scope.gridOptions1.paginationPageSizes.push({label: 'ALL', value: $scope.gridOptions1.data.length});
});

Теперь идет сложная часть!

Вы должны изменить шаблон-шаблон, чтобы он соответствовал вашему новому объекту paginationPageSizes.

$templateCache.put('ui-grid/pagination',
  "<div class=\"ui-grid-pager-panel\" ui-grid-pager ng-show=\"grid.options.enablePaginationControls\"><div class=\"ui-grid-pager-container\"><div class=\"ui-grid-pager-control\"><button type=\"button\" ng-click=\"paginationApi.seek(1)\" ng-disabled=\"cantPageBackward()\"><div class=\"first-triangle\"><div class=\"first-bar\"></div></div></button> <button type=\"button\" ng-click=\"paginationApi.previousPage()\" ng-disabled=\"cantPageBackward()\"><div class=\"first-triangle prev-triangle\"></div></button> <input type=\"number\" ng-model=\"grid.options.paginationCurrentPage\" min=\"1\" max=\"{{ paginationApi.getTotalPages() }}\" required> <span class=\"ui-grid-pager-max-pages-number\" ng-show=\"paginationApi.getTotalPages() > 0\">/ {{ paginationApi.getTotalPages() }}</span> <button type=\"button\" ng-click=\"paginationApi.nextPage()\" ng-disabled=\"cantPageForward()\"><div class=\"last-triangle next-triangle\"></div></button> <button type=\"button\" ng-click=\"paginationApi.seek(paginationApi.getTotalPages())\" ng-disabled=\"cantPageToLast()\"><div class=\"last-triangle\"><div class=\"last-bar\"></div></div></button></div><div class=\"ui-grid-pager-row-count-picker\">"+

  "<select ng-model=\"grid.options.paginationPageSize\""+

  //"ng-init=\"grid.options.paginationPageSize = grid.options.paginationPageSizes[0]\" " +

  "ng-options=\"o.value as o.label for o in grid.options.paginationPageSizes track by o.label\">"+

  "</select><span class=\"ui-grid-pager-row-count-label\">&nbsp;{{sizesLabel}}</span></div></div><div class=\"ui-grid-pager-count-container\"><div class=\"ui-grid-pager-count\"><span ng-show=\"grid.options.totalItems > 0\">{{showingLow}} - {{showingHigh}} {{paginationOf}} {{grid.options.totalItems}} {{totalItemsLabel}}</span></div></div></div>"
);

См. 4-я строка, где я добавил новую логику разбора.

Теперь о нелегко решить проблему. Как вы можете видеть в Plunkr, у вас нет выбора по умолчанию таким образом, потому что вы получили объект вместо простых значений.

Блок ng-init показывает, что можно было бы сделать по этому поводу, но вам нужно будет глубоко углубиться в исходный код, потому что paginationPageSize используется как простой номер в своем коде, и вместо этого у нас есть объект.

Обновление: я попробовал несколько настроек, и это действительно сработало. Использование опций без трека сделало разницу. См. Обновленный Plunkr.

"ng-init=\"grid.options.paginationPageSize = grid.options.paginationPageSizes[0].value\" " +

"ng-options=\"o.value as o.label for o in grid.options.paginationPageSizes\">"+