Как получить индекс строки в angular ui-grid 3.0

Ответ 1

Невозможно легко получить индекс строки, так что это зависит от того, что вы пытаетесь сделать. Что вы ожидаете от нумерации, когда кто-то сортирует данные - вы хотите, чтобы номера оставались такими, какие они были в исходных данных, или вы хотите, чтобы они изменились и соответствовали новому порядку сортировки?

В FAQ http://ui-grid.info/docs/#/tutorial/499_FAQ мы находим:

Вопрос в том, чего вы действительно пытаетесь достичь. Вам нужен фактический индекс строки или вы хотите отображать последовательный идентификатор во всех ваших строках?

Если последнее, вы можете сделать это, просто добавив столбец-столбец к своим данным:

$scope.myData.forEach( function( row, index){
  row.sequence = index;
});

Если вы хотите показать индекс строки внутри внутренних элементов сетки, это зависит от того, какой из внутренних функций вы хотите. Вы можете получить индекс строки в grid.rows, который будет отображать строку как она находится в списке исходных строк (не фильтруется и не сортироваться), или индекс строки в grid.renderContainers.body.visibleRowCache(фильтруется и сортировка) или индекс рендеринга строки в отображаемых в настоящее время строках (данная виртуализация, как правило, является особенно бесполезным числом).

Если вы в порядке, что всякий раз, когда кто-то сортирует или фильтрует, цифры будут меняться, тогда вы можете сделать это с помощью cellTemplate, что было бы примерно так:

cellTemplate: '<div class="ui-grid-cell-contents">{{grid.renderContainers.body.visibleRowCache.indexOf(row)}}</div>'

Ответ 2

cellTemplate: ' {{rowRenderIndex + 1}} '

Ответ 3

проблема первого решения состоит в том, что он не работает должным образом с нумерацией страниц. шаблон ячейки столбца индекса должен быть примерно таким, чтобы иметь правильный индекс на каждой странице, а не начинаться с 1 на каждой странице:

{ field: 'index', displayName: 'Index', width: '50', cellTemplate: '<div class="ui-grid-cell-contents">{{grid.renderContainers.body.visibleRowCache.indexOf(row)+(grid.options.paginationPageSize*(grid.options.paginationCurrentPage-1))+1}}</div>' }

это решение будет работать даже для нумерации страниц на стороне клиента или для нумерации страниц на стороне сервера

Ответ 4

используя этот способ для решения этой проблемы...

$http.get('./api/ioni_users')
        .success(function(data) {
            $scope.gridOptions.data = data;
            angular.forEach(data, function(data, index) {
                data["index"] = index+1;
                //data.push({"index":index+1})
            })
        });

Ответ 5

Следующее работало для меня, поскольку мне нужно было видеть индекс строки, поскольку она связана со всем набором данных, а не только с тем, что было видимо для пользователя. Его можно очистить, но это исходный код, который я смог получить, используя формулу

((0/100)+((2*100)-100))+1 where 

0 = rowIndex (Zero Based)
100 = pagination page size
2 = current page
+1 = because the array is zero based


cellTemplate: '<div class="ui-grid-cell-contents">{{(((grid.renderContainers.body.visibleRowCache.indexOf(row) / grid.options.paginationPageSize)*100)+((grid.options.paginationPageSize * grid.options.paginationCurrentPage) - grid.options.paginationPageSize)) + 1}} </div>'

Надеюсь, что это поможет.

Ответ 6

Используйте rowRenderIndex в своем шаблоне ячейки, это собственная переменная, доступная в каждой строке

Например

columnDefs: [
          {
            enableFiltering: false,
            enableSorting: false,
            field: "sn",
            displayName: "Sn#",
            cellTemplate:
              "<div class=\"ui-grid-cell-contents\" >{{rowRenderIndex}} s</div>"
          }
]