2014-11-12 1 views
1

내 응용 프로그램에 ng-grid가 있습니다. 그리드의 높이와 너비는 자동으로 주어집니다. 그리드에 열을 동적으로 추가 할 수있는 옵션이 있습니다. 열의 수가 적 으면 문제가 없습니다. 그러나 더 많은 수의 열이 있으면 가로 스크롤 막대를 가져 오는 대신 내 열의 크기가 줄어들고 모든 열이 내 눈금에서 더러운 방식으로 나타납니다. 모눈의 너비가 변경되지 않고 모눈에 맞게 모든 열이 축소됩니다. 가로 스크롤 막대를 얻으려면 무엇을 놓치고 있습니까?가로형 화면 이동 - 2.0.11

편집 : 위의 내용은 저의 원래 질문입니다. 이제 가로 스크롤 막대를 가져올 수 있습니다. 그러나 특정 컬럼 만 볼 수 있습니다. 오른쪽으로 스크롤하면 빈 격자가 생깁니다. 지난 몇 개월 동안은 그리드에 묶여 있지 않았습니다. 스크롤없이 ng-grid에 맞는 열만 Y 인드됩니다. 어떤 해결책을주십시오!

참고 : ng-grid 2.0.11을 사용하고 있습니다. 버전에이 버그가 있습니까?

https://github.com/angular-ui/ng-grid/issues/2071

+2

당신이 당신의 코드를 게시 할 수 있습니까? 문제는 너비가 자동이라고 생각합니다. 이로 인해 열이 축소됩니다. 'overflow-x : auto'와 함께 격자의 고정 너비 (100 %?)를 시도해 볼 수 있습니다. – peppeocchi

답변

0

나는 비슷한 문제를 가지고이 두 단계를 다음 :

The width of each column should be given in px format only. There will be some issue if it is given in %format. 

The ng-grid.css have to be updated to have .ngviewport class with overflow:auto. In my project .ngviewport did not have overflow and this too was a reason for the issue. 
3

당신은 여분의 열은 다음과 같이 columnDefs를 추가 추가하는 경우 가로 스크롤 막대를 추가하려면 :

$scope.gridOptions = { 
    data: 'myData', 

    columnDefs: [{ field: "<fieldname>", width: 120}, 
       { field: "<fieldname>", width: 120 }, 
       { field: "<fieldname>", width: 120 }, 
       { field: "<fieldname>", width: 120 }] 
    }; 

(총 열 * 열 너비)의 폭보다 큰 경우 CSS 부분에 선언 된 ng-grid 표 이것은 가로 스크롤 막대를 제공합니다.

angularJS는 기본적으로 ng-grid에 .gridStyle 클래스를 사용합니다.

참조 : ng-grid 또한 열 고정 예를 여기에서 확인하실 수 있습니다

: columnDefs example with pinning 경우

에는 다음 columnDefs 열에서, 그래서 기존 테이블 폭에 자동 맞춤하려고하지 않습니다가있는 경우 결과 열이 축소됩니다.

+0

너비를 퍼센티지 유형으로 표시하는 방법은 없습니다. 제공 한 예는 px 크기입니다. 내가 맞습니까? – sms

+1

@sms : 예! 위의 예에서는 픽셀 형식의 너비입니다. 너비를 % 모드로 사용하려면 할 수 있습니다. NG 그리드의 기본 CSS에서는 너비를 %로 사용할 수 있습니다. Try :: 위의 예제에서 .gridStyle 클래스 아래 너비를 px에서 %로 변경합니다. –

+0

하지만 지금 직면하고있는 문제는 데이터가 눈금에 맞는 열에 대해서만 바인딩된다는 것입니다. 가로 스크롤 막대는 지금 거기에 있지만 스크롤 할 때 나는 빈 그리드를 얻는다. – sms