2015-02-05 2 views
0

이것은 내가 내 데이터의 인덱스 번호가없는 내 columnDef각도에 ng-grid가있는 현재 행 인덱스를 어떻게 표시합니까?

$scope.communityColDef = [{ field: 'name', displayName: 'Name' }, 
          { field: 'description', displayName: 'Description' }]; 

이지만, 그리드를 표시 할 때 내가 행 번호를 표시합니다. jqGrid에서 행 번호를 설정하는 옵션이 있지만 angularJS에서 비슷한 기능을 찾을 수 없습니다.

답변

0

데이터를 그리드 옵션으로 설정하기 전에 데이터 json 안에 인덱스를 추가하십시오. 이 고마워 도움이 될 수

CODE

$scope.communityColDef = [{ 
    field: 'index', 
    displayName: 'Sr. Number' 
}, { 
    field: 'name', 
    displayName: 'Name' 
}, { 
    field: 'description', 
    displayName: 'Description' 
}]; 

$scope.items = data; 
//adding index for showing serial number 
angular.forEach($scope.items, function(item, index) { 
    item.index = index + 1; 
}); 
$scope.gridOptions.columnDefs = $scope.communityColDef; 
$scope.gridOptions.data = $scope.items; 

희망.

2

그래,이 방법을 찾았지만 여러 가지 문제가 있습니다. 첫째로 그것은 시각적 인 것입니다. 즉, 이것은 명시 적으로 필드 데이터를 설정하거나 이전 대답이하는 방식으로 항목을 변경하지 않습니다. 또한 내 솔루션이 다른 정렬 또는 다른 ngTable 기능과 어떻게 상호 작용하는지 알지 못합니다. 여기

코드입니다 :

var app = angular.module('myApp', ['ngGrid']); 
app.controller('MyCtrl', function($scope) { 
    $scope.myData = [{name: "Moroni", age: 50}, 
        {name: "Tiancum", age: 43}, 
        {name: "Jacob", age: 27}, 
        {name: "Nephi", age: 29}, 
        {name: "Enos", age: 34}]; 
    $scope.gridOptions = { 
     data: 'myData', 
     columnDefs: [ 
     {displayName:'#', cellTemplate: '<div>{{$parent.$index + 1}}</div>'}, 
     {field: 'name', displayName: 'Name'}, 
     {field:'age', displayName:'Age'}] 
    }; 
}); 

이, 행 번호는 모든 방법에 새 열 추가되는 순수 화장품 솔루션 인이 JQuery와 작동 방식과 유사 떠났다. 이렇게하면 행 번호를 사용하기 위해 데이터 나 항목을 변경하지 않아도되지만 앞서 언급 한 문제가 발생한다는 이점이 있습니다.

Here 내 솔루션을 표시하는 plnkr입니다.

+0

데이터를 변경할 수있는 옵션이 없으므로 고맙습니다. :) – Amrut

+0

@Amrut 다음이 허용되어야합니다 대답 – dtortola

0

셀 서식 파일에서 row.rowIndex를 사용할 수도 있습니다. 위의 내용을 수정했습니다. plunker

var app = angular.module('myApp', ['ngGrid']); 
app.controller('MyCtrl', function($scope) { 
    $scope.myData = [{name: "Moroni", age: 50}, 
        {name: "Tiancum", age: 43}, 
        {name: "Jacob", age: 27}, 
        {name: "Nephi", age: 29}, 
        {name: "Enos", age: 34}]; 
    $scope.gridOptions = { 
     data: 'myData', 
     columnDefs: [ 
     {displayName:'#', cellTemplate: '<div class="ngCellText" data-ng-class="col.colIndex()"><span>{{row.rowIndex + 1}}</span></div>'}, 
     {field: 'name', displayName: 'Name'}, 
     {field:'age', displayName:'Age'}] 
    }; 
});