2014-07-15 2 views
1

그래서 저는 angularJS를 배우고 ng-repeat 및 $ http 서비스를 망설였습니다.AngularJS OrderBy 문제

웹 서비스를 선택하여 데이터를 반환하고 ng-repeat에 입력하면 정상적으로 작동합니다.

색상 이름으로 표 A-Z, Z-A를 재구성 할 수 있기를 원하지만 작동하지 않습니다. 나는 JSON 구조와 관련이 있다는 것을 확신한다.

JSFiddle : http://jsfiddle.net/wshekyls/bKGPj/

HTML 코드 :

<div ng-controller="testCtrl">Sort : 
<select ng-model="selectedColumn"> 
<option value="name">A-Z</option> 
<option value="-name">Z-A</option> 
</select> 
<table> 
<tr> 
<th>Name</th> 
<th>Cloth</th> 
<th>Leather</th> 
<th>Metal</th> 
</tr> 
<tr ng-repeat="color in colorData | orderBy:selectedColumn"> 
<td>{{color.name}}</td> 
<td style="background: rgb({{color.cloth.rgb.join()}});">{{color.cloth.rgb}}</td> 
<td style="background: rgb({{color.leather.rgb.join()}});">{{color.cloth.rgb}}</td> 
<td style="background: rgb({{color.metal.rgb.join()}});">{{color.cloth.rgb}}</td> 
</tr> 
</table> <pre>{{colorData | json}}</pre> 
<!-- !!!!!!!!! --> 
</div> 

JS :

var app = angular.module('myApp', []); 

function testCtrl($scope, $http) { 

$http.get('https://api.guildwars2.com/v1/colors.json').success(function (data) { 
    $scope.colorData = data.colors; 
}); 

$scope.selectedColumn = 'name'; 
} 

답변

2

수익 데이터가 배열이 아닌 및 해 orderBy는 어레이와 함께 작동 ...

과 작업하려면 모든 데이터를 배열로 푸시해야합니다.

여기
$http.get('https://api.guildwars2.com/v1/colors.json').success(function (data) { 
    $scope.colorData = []; 
    angular.forEach(data.colors, function(color){ 
     $scope.colorData.push(color);  
    }); 
}); 

JSFIDDLE을 일하는된다이 같은 코드를 다시 정렬 할 경우이 작동합니다 ...

+0

완벽하게 작동합니다, 감사합니다. – wozzashek

관련 문제