데이터 바인딩 - 사용자 격자 - 우수한 라이브러리

내 응용 프로그램에 UI 격자를 구현하려고합니다. 정적 데이터를 gridOptions.data에 할당하면 모든 것이 잘 작동합니다. 그러나 서버에서 데이터를로드 한 후 데이터를 gridOptions.data에 동적으로 할당하면 항상 빈 문자열이 표시됩니다. 동적 인 동작을 $timeout 함수를 사용하여 복제하려고 시도했지만 그 결과는 여전히 동일합니다. 빈 그리드입니다.데이터 바인딩 - 사용자 격자

// Ctrl 키이 작동

을 시작합니다.

$scope.data = [ 
      { addedBy :"user", displayName:"Name1" }, 
      { addedBy :"user2", displayName:"Name2" }, 
      { addedBy :"user3", displayName:"Name3" } 
      ];

이하지 않습니다; 그리드를 비워 둡니다.

$timeout(function() { 
     $scope.data = [ 
     { addedBy :"user", displayName:"Name1" }, 
     { addedBy :"user2", displayName:"Name2" }, 
     { addedBy :"user3", displayName:"Name3" } 
     ]; 
    });

코드의 나머지 부분은 동일하게 유지됩니다.

$scope.columnDefs = [ 
     {name: 'displayName'}, 
     {name: 'addedBy'} 
     ]; 

$scope.gridOptions = { 
columnDefs: $scope.columnDefs, 
data: $scope.data 
};

// Ctrl 키가 종료

는 // HTML은

을 종료 // HTML

<div class="col-md-12 no-padding" ui-grid="gridOptions" class="grid"></div>

내가 꽤 UI 그리드 때 데이터 데이터를 업데이트 할 수 있어야한다 생각합니다 시작 변수 변경; 거기에 내가 누락 된 기본적인 것이 있습니까?

출처

2016-12-12 user1242321

그리드가 초기화 될 때 데이터를 사용할 수 없습니다. Ronald가 말한 것처럼 수동으로 notifydataChange을 호출하여 그리드를 업데이트하거나 재 할당해야합니다.

그들은 당신이 할 수있는 또 다른 옵션은 빈 배열로 그리드의 정의를 기본 및 서버 호출의 응답 그리드에 할당 후자

출처

2016-12-12 21:35:20 ndoes

감사합니다. @ndoes, 어떤 아이디어가 notifyDataChange 호출의 매개 변수 여야합니까? 예제/문서의 링크가 도움이 될 것입니다. 내가 공유하는 링크에서 열을 제거/추가하는 예를 볼 수 있지만 notifyDataChange API의 특정 정의는 무엇입니까? – user1242321

무시; 나는 그것을 여기에서 찾았다 : https://github.com/angular-ui/ui-grid/blob/441613f/src/js/core/factories/Grid.js # L617 및 여기 : http://ui-grid.info/docs/#/api/ui.grid.class:Grid – user1242321

자신의 documentation의 예를 가지고있다.

$scope.columnDefs = [ 
     {name: 'displayName'}, 
     {name: 'addedBy'} 
     ]; 

$scope.gridOptions = { 
columnDefs: $scope.columnDefs, 
data: [] 
}; 

$timeout(function() { 
     $scope.data = [ 
     { addedBy :"user", displayName:"Name1" }, 
     { addedBy :"user2", displayName:"Name2" }, 
     { addedBy :"user3", displayName:"Name3" } 
     ]; 
$scope.gridOptions.data=$scope.data; 
    });

출처

2016-12-12 21:40:42 Ronald91

데이터가 많은 매개 변수에 대해 새로 고치는 매우 동적 인 그리드가 있습니다. 나는 항상 데이터를 $ scope.gridOptions.data에 직접 할당합니다.

즉

$timeout(function() { 
    $scope.gridOptions.data = [ 
    { addedBy :"user", displayName:"Name1" }, 
    { addedBy :"user2", displayName:"Name2" }, 
    { addedBy :"user3", displayName:"Name3" } 
    ]; 
});

데이터는 당신의 모든 검색 결과에 대한, 여기에 재 할당되고

이벤트는 다음과 같이 사용할 수 있습니다

NotifyDataChange :

$scope.gridOptions.onRegisterApi = function (gridApi) { 
    //set gridApi on scope 
    $scope.gridApi = gridApi; 
     $scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.COLUMN); 
    };

당신이 uiGridConstants 종속성을 추가 할 필요가 당신의 제어 장치. 그러나 내 결과/테스트에서 gridOptions.data에 데이터를 다시 할당하면 notifyDataChange 이벤트가 필요하지 않습니다.

출처

2016-12-13 05:19:27 Bhavjot

이 작업을 수행합니까? 설명서에 따라 이상한 생각이 들었습니다. 데이터가 그리드에서 업데이트되지 않아야하는 notifyDataChange 이벤트를 호출해야합니다. – user1242321

그리드에서 notifyDataChange 이벤트를 사용하고있는 것으로 나타났습니다. 그러나이 시나리오에서는 데이터가 재 할당되므로 해당 이벤트 없이는 데이터가 제대로 작동해야합니다. 나는 언젠가 그것을 오늘 시험 할 것이고, 나의 결과로 당신을 새롭게 할 것이다. – Bhavjot

예, 데이터 재 할당에 notifyDataChange 이벤트가 필요하지 않습니다. – Bhavjot

데이터 바인딩 - 사용자 격자

답변

관련 문제