2017-12-13 14 views
0

컨트롤러 내에 $ scope.addresscards에 객체가 저장되어 있습니다. js는 다음과 같습니다 :ng-repeat의 키 별 객체 정렬 정렬

var myApp = angular.module('myApp', []); 
function MyCtrl($scope) { 
    $scope.addresscards = { 
     "work_address": { 
      "location":"workLoc", 
      "address": "workAddr", 
      "flat_no": "worknumber", 
      "landmark": "workLandmark" 
     }, 
     "random1_address": { 
      "location":"someLoc", 
      "address": "SomeAddr", 
      "flat_no": "Somenumber", 
      "landmark": "someLandmark" 
     }, 
     "home_address": { 
      "location":"homeLoc", 
      "address": "homeAddr", 
      "flat_no": "homenumber", 
      "landmark": "homeLandmark" 
     }, 
     "random2_address": { 
      "location":"someLoc2", 
      "address": "SomeAddr2", 
      "flat_no": "Somenumber2", 
      "landmark": "someLandmark2" 
     } 
    }; 
} 

나는 주소를 표시하기 위해 ng-repeat를 사용하고 있습니다.

<div ng-controller="MyCtrl"> 
    <ul ng-repeat="(addressKey,addressVal) in addresscards"> 
    <li>{{addressKey}} has :: {{addressVal.location}},{{addressVal.address}}, {{addressVal.location}}, {{addressVal.address}}</li> 
    </ul> 
</div> 

내 출력은 다음과 같습니다 : 다음은 HTML입니다

home_address has :: homeLoc, homeAddr, homeLoc, homeAddr 
random1_address has :: someLoc, SomeAddr, someLoc, SomeAddr 
random2_address has :: someLoc2, SomeAddr2, someLoc2, SomeAddr2 
work_address has :: workLoc, workAddr, workLoc, workAddr 

내가 출력을 표시 할은, 그 객체는 객체가있는 경우 다음을 work_address, 1을 표시한다 home_address 경우 표시되어야합니다. 그러면 나머지 물체는 사전 순으로 보여야합니다.

home_address has :: homeLoc, homeAddr, homeLoc, homeAddr 
work_address has :: workLoc, workAddr, workLoc, workAddr 
random1_address has :: someLoc, SomeAddr, someLoc, SomeAddr 
random2_address has :: someLoc2, SomeAddr2, someLoc2, SomeAddr2 

내가 해 orderBy은, 그것은 객체에서 작동하지 않습니다 사용하여 시도 : 여기

내가 표시 할 결과를 것으로 예상된다. 이것을 어떻게 성취합니까?

당신은 당신의 주소에 속성을 추가 할 수 있습니다

답변

1

$scope.addresscards = { 
     "work_address": { 
      "location":"workLoc", 
      "address": "workAddr", 
      "flat_no": "worknumber", 
      "landmark": "workLandmark", 
      "sort" : "2" 
     }, 
     "random1_address": { 
      "location":"someLoc", 
      "address": "SomeAddr", 
      "flat_no": "Somenumber", 
      "landmark": "someLandmark" 
     }, 
     "home_address": { 
      "location":"homeLoc", 
      "address": "homeAddr", 
      "flat_no": "homenumber", 
      "landmark": "homeLandmark", 
      "sort" : "1" 
     }, 
     "random2_address": { 
      "location":"someLoc2", 
      "address": "SomeAddr2", 
      "flat_no": "Somenumber2", 
      "landmark": "someLandmark2" 
     } 
    }; 

개체를하고 당신이 알파벳 순서에 대한 주소 키를 먼저 한 후 집으로 표시 종류 및 직장 주소에 의해 처음으로 여러 필드를 ORDERBY 수 NG-반복합니다.

<ul ng-repeat="(addressKey,addressVal) in addresscards | orderBy:['sort','addressKey']"> 
    <li>{{addressKey}} has :: {{addressVal.location}},{{addressVal.address}}, {{addressVal.location}}, {{addressVal.address}}</li> 
    </ul> 

또는 컨트롤러에서 다른 모든 주소를 정렬하고 집과 직장 주소를 목록의 시작 부분에 추가 할 수 있습니다.

Plunker

+0

나는 이것을 시도했지만 작동하지 않는다. {{addressVal.address}}, {{addressVal.address}}, {{addressVal.location}}, {{addressVal.address}} { {}}' –

+0

오류가 발생했기 때문에 콘솔에서 오류를 공유 할 수 있습니까? – NTP

+0

개체에서 ','이 (가) 누락되어 오류가 발생했습니다. 오류가 제거되었지만 여전히 정렬되지 않았습니다. 나는 여전히 같은 결과물을 얻고있다. –