2017-05-17 3 views
0

여기 Angular-JS에서 Kendo-UI를 사용하고 있습니다.Kendo Pager (페이지 가능)가 레코드가 있어도 '표시 할 항목이 없습니다'를 표시합니다

검도 격자 표에 페이지 매김 (페이지 가능)을 통합하는 동안 문제가 발생하여 데이터 (레코드)가 제대로로드 되더라도 '표시 할 항목이 없습니다'라는 메시지가 표시됩니다. 다음

무슨 일이 잘못, 어떤 도움이 충당 될 것이다 확실하지 ...

내가 데이터 그리드 init을 /로드 사용하고있는 기능입니다.

function getProjectsAtAGlance() { 
       $scope.gridOptions = { 
        scrollable: false, 
        sortable: true, 
        pageable: { 
         pageSizes: [5, 10, 15, 20, 25, 50] 
        }, 
        change: function (e) { 
         $scope.pageSize = $scope.gridOptions.dataSource.pageSize(); 
        }, 
        dataSource: { 
         serverPaging: true, 
         transport: { 
          read: function (options) { 

           $scope.options = options; 

           var filters = { 
            skip: options.data.skip, 
            take: options.data.take, 
            sortBy: $scope.sortBy, 
            projectGlanceIncludeArchived: $scope.includeArchivedProjects, 
            projectGlanceExcludeProjectsWithNoBudgets: $scope.excludeProjectsWithNoBudgets 
           }; 

           $http.post("/Home/ProjectsAtAGlanceReport", filters) 
            .success(function (result) { 
             var projects = result.projects; 

             for (var i = 0; i < projects.length; i++) { 
              var project = projects[i]; 
              project.startDate = moment(projects[i].startDate).format("L"); 
              project.endDate = moment(projects[i].endDate).format("L"); 
             } 

             options.success(projects); 

            }) 
            .error(function (error) { 
             console.log(error); 
            }); 
          } 
         }, 
         pageSize: $scope.pageSize, 

         schema: { 
          total: function (respose) { 
           return $scope.data; 
          }, 

          model: { 
           fields: { 
            name: { 
             editable: false, 
             nullable: true 
            }, 
            resourceCount: { 
             editable: false, 
             nullable: true 
            }, 
            clientName: { 
             editable: false, 
             nullable: true 
            }, 
            startDate: { 
             editable: false, 
             nullable: true 
            }, 
            endDate: { 
             editable: false, 
             nullable: true 
            }, 
            projectId: { 
             editable: false, 
             nullable: true 
            }, 
            projectedBudgetPercentage: { 
             defaultValue: 100 
            }, 
            defaultValue: { 
             totalBudget: 0, 
             totalHours: 0, 
             burnedBudget: 0, 
             burnedHours: 0, 
             projectedBudget: 0,           
             projectedHours: 0, 
             projectedHoursPercentage: 0, 
             remainingBudget: 0, 
             remainingBudgetPercentage: 0, 
             remainingHours: 0, 
             remainingHoursPercentage: 0 
            } 
           } 
          } 
         } 
        }, 

        columns: [ 
         { 
          template: "<div class='name-column'>" + 
           "<p><a class='highlighted-blue' href='/Projects/ProjectAdmin/{{dataItem.projectId}}'>{{dataItem.name}}</a></p>" + 
           "<small>{{dataItem.clientName}}</small>" + 
           "<small ng-if=\"dataItem.startDate !== 'Invalid date'\">{{dataItem.startDate}} - {{dataItem.endDate}}</small>" + 
           "<small ng-if=\"dataItem.startDate === 'Invalid date'\"><i class='fa fa-exclamation-triangle text-danger'></i> Start date and end date are not defined.</small>" + 
           "<small>{{dataItem.resourceCount}} Resources</small></div>" 

         }, 
         { 
          template: kendo.template($("#kendoProgressBarColumnTemplate").html()) 
         }, 
         { 
          template: "<accuracy-gauge-per-project accuracy='dataItem.accuracy'></accuracy-gauge-per-project>" 
         }, 
         { 
          template: 
           "<p>{{dataItem.accuracy | percentage:0}} Accurate</p>" + 
           "<p>{{100-dataItem.accuracy | percentage:0}} Non Accurate</p>" 
         } 
        ] 
       }; 
      } 

다음은 참조 용 출력 미리보기입니다.

dataSource: { 
    serverPaging: true, 
    transport: {... // transport options 
    }, 
    pageSize: $scope.pageSize // before end of dataSource  
},... // more grid stuff 

을 그리고 당신은 documentation에 따라 return response.totalschema.total에서 돌아 무엇을 변경 : Kendo Grid with Pagination

답변

1

은 내가 pageSize 속성이 그래서 같은 dataSource 내에서 선언 할 필요가있다 생각합니다.

+0

덕분에 같은 문제를 보았습니다. Sandman – Ajoshi

+0

또 다른 이유는''respose'는 ['schema.total']에 포함되어 있습니다 (http://docs.telerik.com/kendo-ui/api/javascript/). data/datasource # configuration-schema.total)? 이 함수가'return respose.total'이 아니어야합니까? – Sandman

+0

예 Sandman, 맞습니다. 'schema.total'에 문제가 있습니다. "total : function (respose) {return $ scope.data;}"을 (를) 삭제했습니다. 이제 문제가 없습니다. – Ajoshi