2015-01-15 4 views
5

ngTable이있는 테이블에 표시 할 객체 목록이 있습니다. 내가 정렬 및 필드 '라벨'과 'nestObject.label'에 대한 필터링을 허용 할 내 컨트롤러에서ngtable : 중첩 된 객체 정렬 및 필터링

obj {label:string, 
    nestObj{nestLabel:string 
      } 
    } 

: 같은 내 객체 보인다. 나는 이것을 시도 :

Uncaugth syntexError : 예기치 않은 토큰

$scope.tableParams = new ngTableParams({ 
     page: 1,   // show first page 
     count: 10, 
     filter: { 
      label='', 
      nestObj.label='' 
     }, 
     sorting: { 
      label: 'asc', 
      nestObj.label: 'asc' 
     } 
    }, { 
     total: data.length, // length of data 
     getData: function($defer, params) { 
      // use build-in angular filter 
      var filteredData = params.filter() ? 
      $filter('filter')(data, params.filter()) : 
      data; 
      var orderedData = params.sorting() ? 
        $filter('orderBy')(filteredData, params.orderBy()) : 
        data; 

      params.total(orderedData.length); // set total for recalc pagination 
      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
    }   
}); 

하지만 오류를 받고 있어요는 자바 스크립트 컴파일러는 nestObj.label에 필터를 좋아하지 않는다.

nestObj.label을 필터링하고 정렬하지 않으면 IT가 잘 작동합니다.

ngTable을 사용하여 중첩 된 객체를 필터링하고 정렬 할 수 있습니까?

문제를 설명하는 plunker은 다음과 같습니다.

감사합니다.

+0

plunker 또는 jsfiddle ..을 제공 할 수 있습니까? – squiroid

+0

주 메시지에 plunkr을 추가했습니다. – user1260928

답변

8

중첩 된 개체를 사용한 필터링 및 정렬은 현재 ng 테이블에 적합하지 않습니다. 이 post을 읽고 @Kostia Mololkin에서 해결책을 찾았는데 마침내이 버그를 피하는 방법을 찾았고 해결책은 매우 간단합니다. 그에게 큰 감사! 지금이야, 당신은 plunker 여기에이 솔루션을 볼 수 있습니다

for (var i = 0; i < data.length; i++) { 
    data[i].town = ""; //initialization of new property 
    data[i].town = data[i].adresse.town; //set the data from nested obj into new property 
} 

:

난 그냥 데이터 인 배열을 다시 썼다 : 새로운 속성을 초기화와 같은 새 속성으로 중첩 된 개체에서 데이터를 설정 매력처럼 작동합니다 ...

+0

완전히 잘못된 방법으로 해결했기 때문에 이전 답변을 삭제했습니다. 그것이 그 것이기를 바라 라! :) – arman1991

+0

감사합니다 arman, 지금은 잘 작동;) – user1260928

+0

당신이 솔루션에 만족한다면, 당신은 또한 내 대답을 받아 들일 수 :) 나는 내가 도왔 기뻐요. – arman1991

0

나는 두 개의 센트를 추가 했으므로 함수형 프로그래밍을 사용하는 것을 두려워하지 마십시오. 데이터가 단순 편평하고 내 의견 청소기과 같이 :

var flattenedArray = dataArray.map(function(obj) { 
    return { 
     label: obj.label, 
     nestedLabel: dataItem.nestedObj.nestedLabel 
    }; 
}); 

은 그럼 당신은 쉽게 ngTable에 labelnestedLabel으로 정렬 할 수 있습니다.

참고 : 조금 더 많은 메모리가 소비되도록 여기에 복사본을 작성한다는 것을 알고 있습니다.

0

중첩 된 매개 변수를 지원하고 주문 및 페이징을 추가로 지원하는 방법은 getData입니다. $filter을 삽입하고 myData의 이름을 자신의 데이터 배열로 바꿔야합니다. 희망이 도움이 될 수 있습니다.

$scope.tableParams = new NgTableParams({}, 
{ 
    getData: function($defer, params) { 

     // organize filter as $filter understand it (graph object) 
     var filters = {}; 
     angular.forEach(params.filter(), function(val,key){ 
      var filter = filters; 
      var parts = key.split('.'); 
      for (var i=0;i<parts.length;i++){ 
       if (i!=parts.length-1) { 
        filter[parts[i]] = {}; 
        filter = filter[parts[i]]; 
       } 
       else { 
        filter[parts[i]] = val; 
       } 
      } 
     }) 

     // filter with $filter (don't forget to inject it) 
     var filteredDatas = 
      params.filter() ? 
       $filter('filter')(myDatas, filters) : 
       myDatas; 

     // ordering 
     var sorting = params.sorting(); 
     var key = sorting ? Object.keys(sorting)[0] : null; 
     var orderedDatas = sorting ? $filter('orderBy')(filteredDatas, key, sorting[key] == 'desc') : filteredDatas; 

     // get for the wanted subset 
     var splitedDatas = 
      orderedDatas.slice((params.page() - 1) * params.count(), 
       params.page() * params.count()); 

     params.total(splitedDatas.length); 

     // resolve the ngTable promise 
     $defer.resolve(splitedDatas); 
    } 
});