AngularJs ng-repeat order 중첩 된 개체 속성에 대해 작동하지 않습니다.

Question

중첩 된 개체 속성을 반복하고 순서를 지정하려했지만 순서가 작동하지 않습니다.

내가 본 적이 : How to orderby in AngularJS using Nested property

하지만 JSON 구조가 다르기 때문에 내가 그것을 작동시킬 수 없습니다.

Plunker

내 코드 :

<div ng-repeat="item in data | orderBy:order.allListPosition"> 
     <div>{{item.name}} - {{item.order}}</div> 
    </div> 

범위 :

$scope.data = { 
      "78962": { 
       "id": "78962", 
       "name": "item 2", 
       "type": "blind", 
       "order": { 
         "allListPosition": "008", 
         "catListPosition": "059" 
         }, 
       "data": { 
         "status": "stop", 
         "percent": 20 
         }, 
       "longPress": { 
         "item": "78966", 
         "active": true 
         } 
      }, 
      "78963": { 
        "id": "78963", 
        "name": "item 3", 
        "type": "coolmaster", 
        "order": { 
         "allListPosition": "053", 
         "catListPosition": "001" 
        }, 
        "data": { 
          "status": 1, 
          "temp": 16, 
          "point": 25, 
          "mode": "cool", 
          "fan": 3 
          }, 
       "longPress": { 
          "item": "78966", 
          "active": false 
          } 
       } 
      }; 

사람이 내가 잘못하고있는 무슨 나를 보여 주시겠습니까?

감사의 많이

아비

Answer 1

는 두 가지 이유 orderBy 있습니다 여기에 작동하지 않습니다 :

• orderBy은 배열에서만 작동하지만 평범한 개체에 적용하고 있습니다.
• 식으로 주문하려면 orderBy에 식과 함께 문자열 값을 제공해야합니다. 당신은 order.allListPosition을주고 있는데, 이것은 $scope.order.allListPosition과 같습니다 (존재하지 않습니다).

  $scope.dataArray = Object.keys($scope.data) 
      .map(function(key) { 
      return $scope.data[key]; 
      }); 
  

  번째 문제를 해결하기 위해 (그리고 위에서 dataArray 통합) :

는 데이터 오브젝트의 배열을 추가 한 제 문제를 해결하기

<div ng-repeat="item in dataArray | orderBy:'order.allListPosition'"> 

http://plnkr.co/edit/BXgYPTElSM3sjvLg30CL?p=preview

Answer 2

당신은 neasted 속성에 의해 주문하는 사용자 정의 필터를 만들 수 있습니다. 당신은 항상 각도가 restritive 언어 아니라고 생각한다

<div ng-repeat="item in data | customorder"> 
    <div>{{item.name}} - {{item.order}}</div> 
</div> 

처럼

myApp.filter('customorder', function() { 
    return function(items) { 
    items.sort(function(a,b){ 
     // Make sure we are comparing integers 
     var aPos = parseInt(a.order.allListPosition); 
     var bPos = parseInt(b.order.allListPosition); 

     // Do our custom test 
     if (aPos > bPos) return 1; 
     if (aPos < bPos) return -1;   
     return 0; 
    }) 
    } 
}); 

귀하의 HTML을 볼 것이다. 일반적으로 사용하는 필터는 built in filters입니다. 그러나 필요한만큼 빨리 자신의 필터로 재미있게 놀 수 있습니다!

Answer 3

data 개체는 개체의 개체이며 개체 배열이 아닙니다.

따라서 orderBy은 배열과 만 호환되므로 작동하지 않습니다.

$scope.data = [ 
      {    
       "id": "78961", 
       "name": "item 1", 
       "type": "blind", 
       "order":{allListPosition:"093",catListPosition: "009"}, 
       "data": { 
        "status": "up", 
        "percent": 80 
       }, 
       "longPress": { 
        "item": "78966", 
        "active": true 
       } 

      }, 
      { 
       "id": "78962", 
       "name": "item 2", 
       "type": "blind", 
       "order":{allListPosition:"008",catListPosition: "059"}, 
       "data": { 
        "status": "stop", 
        "percent": 20 
       }, 
       "longPress": { 
        "item": "78966", 
        "active": true 
       } 
      }, 
      { 

       "id": "78963", 
       "name": "item 3", 
       "type": "coolmaster", 
       "order":{allListPosition:"053",catListPosition: "001"}, 
       "data": { 
        "status": 1, 
        "temp": 16, 
        "point": 25, 
        "mode": "cool", 
        "fan": 3 
       }, 
       "longPress": { 
        "item": "78966", 
        "active": false 
       } 

      }]; 

그리고 HTML에서 :

나는 그것이 작동되도록 당신의 data 객체를 업데이트 한

<div ng-repeat="item in data | orderBy:'order.allListPosition'"> 
    <div>{{item.name}} - {{item.order}}</div> 
</div> 

Plunker

Answer 4

나는 다음과 같아야합니다.

<div ng-repeat="item in dataArray | orderBy:'item.order.allListPosition'">