2013-11-21 5 views
6

AngularJS를 처음 사용하고 서비스에서 ng-Table을 사용할 때 데이터를 표시하는 데 움찔했습니다. (32 index.html을 : 122)타입 오류 : 팩토리에서 데이터를로드 할 때 정의되지 않은 'slice'메소드를 호출 할 수 없습니다. AngularJS

내가 하드 코딩 된 객체에서 정의되지 않은 방법 '조각'을 호출 할 수 없습니다 $ scope.tableParams.ngTableParams.getData을 :. 나는

형식 오류 오류를 받고 있어요 json 데이터 값은 잘 작동합니다. 공장의 데이터에는 json 데이터 결과 이상이 포함되어 있으므로 슬라이싱에 문제가 있다고 생각합니다.

<div class="row"> 
    <div> 
     <p>Filter: <input class="form-control" type="text" ng-model="filter.$" /></p> 

     <table ng-table="tableParams" class="table"> 
      <tr ng-repeat="user in $data"> 
       <td data-title="'Name'" sortable="name"> 
        {{user.name}} 
       </td> 
       <td data-title="'Age'" sortable="'age'"> 
        {{user.age}} 
       </td> 
      </tr> 
     </table> 
    </div> 
</div> 

답변

4

당신은 테이블 내 $defer를 해결해야합니다

myApp.factory('userData', function($http, $log){ 
    return { 
     getUsers: function(successcb){ 
      $http({method: 'GET', url: 'api/users'}). 
       success(function(data, status, headers, config){ 
        successcb(data); 
        $log.warn(data, status, headers, config); 
       }). 
       error(function(data, status, headers, config){ 
        $log.warn(data, status, headers, config); 
       }); 
     } 
    } 
}); 

내 HTML은 이것이다 :

myApp.controller('usersCtrl', function usersCtrl($scope, userData, $filter, ngTableParams, $log){ 

    userData.getUsers(function(users){ 
     $scope.users = users; 
    }) 

    var users = $scope.users; 

    $scope.$watch("filter.$", function() { 
     $scope.tableParams.reload(); 
    }); 

    $scope.tableParams = new ngTableParams({ 
     page: 1,   // show first page 
     count: 10,   // count per page 
     sorting: { 
      name: 'asc'  // initial sorting 
     } 
    }, { 
     getData: function($defer, params) { 
      var filteredData = $filter('filter')(users, $scope.filter); 
      var orderedData = params.sorting() ? 
           $filter('orderBy')(filteredData, params.orderBy()) : 
           filteredData; 

      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
     }, 
     $scope: $scope 
    }); 

}); 

그럼 내 공장 서비스가 이것이다 :

내 컨트롤러는 다음과 같다 getData 아약스 완료 후. 콘솔에 filteredData을 로깅하려면 지금 바로서야하므로 정의되지 않으므로 슬라이스 할 수 없습니다.

하기에 userData.getUsers 이동하십시오 :이 나를 도와 않았다

getData: function ($defer, params) { 
    /* make ajax call */ 
    userData.getUsers(function(users) { 
     /* now we have data to work with*/ 
     $scope.users = users; 

     var filteredData = $filter('filter')(users, $scope.filter); 
     var orderedData = params.sorting() ? $filter('orderBy')(filteredData, params.orderBy()) : filteredData; 
     /* and can resolve table promise */ 
     $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 

    }) 

} 
+0

오 영광; 고맙습니다 – Fergus