2014-04-01 2 views
0

내 각형 응용 프로그램에서 그리드 필터를 표시 할 수 없습니다. 필터 아이콘이 아닌 일반 열 머리글 만 표시됩니다.KendoUI Grid - 필터가 표시되지 않습니다.

여기
<div ng-controller="IntroductionWizardCtrl"> 
     <h3 class="text-muted">Step 2: Select Application To Describe</h3> 

    <div kendo-grid id="grid" 
      k-data-source="dataSource" 
      k-sortable="true" 
      k-on-change="selectedItem = data" 
      k-selectable="'row'" 
      k-pageable='{ "refresh": true, "pageSizes": 5 }' 
      k-filterable="true"> 
    </div> 
    <div> 
     <p>{{selectedItem}}</p> 
    </div> 
    <br/> 
    <input type="submit" class="btn btn-primary" wz-next value="Proceed to Next Step" 
      data-ng-click="" /> 
</div> 

는 해당 각도 컨트롤러 :

'use strict'; 

angular.module('wizardApp').controller('IntroductionWizardCtrl', ['$scope', '$location', '$rootScope', 
    function ($scope, $location, $rootScope) { 

     $scope.dataSource = { 
      data: [{id: 1, name: "Account Underwriting - Misc App", bu: 50}, 
       {id: 2, name: "Achieve - Distributed", bu: 43}, 
       {id: 3, name: "ACT!", bu: 27}, 
       {id: 4, name: "Actuarial Database", bu: 29}, 
       {id: 5, name: "Adjustment Invoicing System (AIS)", bu: 34}, 
       {id: 6, name: "buncy Download", bu: 43}, 
       {id: 7, name: "Ariba", bu: 27}, 
       {id: 8, name: "Athena NY", bu: 29}, 
       {id: 9, name: "Authoria", bu: 34}, 
       {id: 10, name: "Avenue", bu: 43}, 
       {id: 11, name: "BC&IT - Services", bu: 27}, 
       {id: 12, name: "Billing Website", bu: 29}, 
       {id: 13, name: "Blue Butler", bu: 34}, 
       {id: 14, name: "BOE External", bu: 43}, 
       {id: 15, name: "Builders Risk", bu: 27}, 
       {id: 16, name: "Business Intelligence", bu: 29}, 
       {id: 17, name: "Care Center", bu: 34}], 

       pageSize: 5, serverFiltering: true 

     }; 
     $scope.rowSelected = function(e) { 
      var grid = e.sender; 
      var selectedRows = grid.select(); 
      for (var i = 0; i < selectedRows.length; i++) { 
       $scope.selectedItem = grid.dataItem(selectedRows[i]); 
       break; 
      } 
     }; 


     $scope.categoryDataSelectedRows=[]; 

     $scope.categoryData= 
      { 
     data: 
      [{name: "General Application Information"}, 
      {name: "User Interface configuration description"}, 
      {name: "Application Architecture"}, 
      {name: "Database"}, 
      { name: "Backup & DR"}, 
      {name: "Design"}, 
      { name: "Operational data"}, 
      { name: "Testing"}, 
      {name: "Application Configuration details"}, 
      { name: "Application connectivity requirements"}, 
      {name: "Deployment Requirements"}, 
      {name: "Application dependencies"}, 
      {name: "Infrastructure dependencies"}, 
      { name: "Business value assessment"}, 
      { name: "Data requirements"}, 
      {name: "Hosting OS requirements"}, 
      { name: "License requirements"}], pageSize: 5 
    } 

     $scope.rowSelectedCategory = function(e) { 
      var gridCategory = e.sender; 
      var selectedRowsCategory = gridCategory.select(); 
      for (var i = 0; i < selectedRowsCategory.length; i++) { 
       $scope.selectedItemCategory = gridCategory.dataItem(selectedRowsCategory[i]); 
       break; 
      } 
     }; 
    } 
]); 

내가 이상 보았다 많은 예제, 각도의 외부 검도 그리드가 잘 작동 필터링을 가지고 여기 내 HTML입니다. 그러나 각 각 검도로 나는이 문제를 겪고있다.

+0

아직이 질문을하지 않으셨습니까 [여기] (http://stackoverflow.com/questions/22775520/angular-kendo-grid-filternot-showing)? 어쨌든, 문제를 재현하는 jsfiddle을 제공 할 수 있습니까? – JohnnyHK

+0

전에 결코 피들을 만들지 않았습니다. 이 문제에 대한 첫 번째 기사는 다음과 같습니다. http://jsfiddle.net/JLMWa/11/ –

+0

방금 ​​업데이트했습니다. 좀 더 읽기 쉽게하기 위해 몇 가지 사항이 삭제되었습니다. http://jsfiddle.net/JLMWa/14/ –

답변

0

글쎄, 내 문제는 다양한 CSS 파일이로드되는 순서와 관련이 있습니다. 부트 스트랩이 다른 스타일을 덮어 썼습니다. 이것을 정리하기 위해 잠시 시간이 걸렸지 만 지금은 각도가있는 검도 그리드가 괜찮습니다. 도와 주셔서 감사합니다!