ng-repeat에서 Angularjs OrderBy가 작동하지 않음
Angular를 사용하려고 합니다.JS는 제 첫 프로젝트(토너먼트 매니저)와orderBy
에 여과하다.ng-repeat
가 동작하지 않는다:(그 것에 관한 모든 문서를 읽었지만, 아무것도 할 수 없다:/
그래서, 내가 정의해놓은 대표팀이$scope
다음과 같이 합니다.
$scope.order_item = "count_win";
$scope.order_reverse = false;
$scope.teams = {
100 : {
id: 100,
name: "XXX",
count_win: 1,
count_loose: 2,
goal_average: 1,
},
200 : {
id: 200,
name: "XXX",
count_win: 1,
count_loose: 2,
goal_average: 1,
},
[...]
};
제가 보기에는 (처음에는 한 가지 주문만 가지고) 재주문하려고 하는데, 잘 되지 않습니다.
<tr ng-repeat="team in teams | orderBy:order_item:order_reverse">
<td>{{team.name}}</td>
<td>{{team.count_loose}}</td>
<td>{{team.goal_average}}</td>
</tr>
두 번째, 2개의 정보에서 재주문하고 싶습니다.count_win
그리고.goal_average
첫 번째가 같다면..대체하려고 합니다.$scope.order_item
그렇게요, 하지만 하나라도 코드가 작동하지 않으면, 그는 절대 2번과 일하지 않을 거예요...
$scope.order_item = ['count_win','goal_average'];
읽어주셔서 감사합니다.게시 사이즈에 대해 사과드립니다.
$scope.teams
어레이가 아닙니다(객체의 객체입니다).orderBy
필터는 어레이에서만 작동합니다.당신이 만든다면$scope.teams
어레이는 동작합니다.
$scope.teams = [
{
id: 100,
name: "team1",
count_win: 3,
count_loose: 2,
goal_average: 2,
},
{
id: 200,
name: "team2",
count_win: 3,
count_loose: 2,
goal_average: 1,
},
{
id: 300,
name: "team3",
count_win: 1,
count_loose: 2,
goal_average: 1,
}
];
또는 오브젝트에 대해 다음과 같은 특수한 필터를 추가할 수 있습니다(여기에서 차용).
app.filter('orderObjectBy', function() {
return function(items, field, reverse) {
var filtered = [];
angular.forEach(items, function(item) {
filtered.push(item);
});
filtered.sort(function (a, b) {
return (a[field] > b[field] ? 1 : -1);
});
if(reverse) filtered.reverse();
return filtered;
};
});
그리고 이렇게 사용하세요.
<tr ng-repeat="team in teams | orderObjectBy:order_item:order_reverse">
이 커스텀 필터는 질문의 두 번째 부분과 같이 정렬 순서 배열에서는 작동하지 않습니다.
주문의 범위 파라미터를 작성할 필요가 없습니다.배열을 취급하고 있는 경우는 마크업으로 직접 작성할 수 있습니다.
<tr ng-repeat="team in teams | orderBy:count_win:false">
두 개의 매개 변수를 사용하여
<tr ng-repeat="team in teams | orderBy:['count_win','goal_average']">
좀 더 복잡한 주문 후에 다음과 같은 함수를 스코프에 만들 수 있습니다.
$scope.customOrder = function (team) {
//custom
}
그냥 이렇게 부르면 돼
<tr ng-repeat="team in teams | orderBy:customOrder">
@Jerrad가 말했듯이ng-repeat
는 어레이에서만 동작하기 때문에 팀 오브젝트를 어레이로 변환하여 올바르게 동작시킬 필요가 있습니다.
ng-repeat은 어레이에서만 동작하며 JSON 개체에서는 동작하지 않습니다.이는 이미 여기에서 설명되었습니다.각 - ng-repeat 순서를 작성할 수 없습니다.작업별
JSON 개체를 배열로 변경하거나 즉시 변환해야 합니다.컨트롤러는 다음과 같이 됩니다.
var app = angular.module('app', []);
app.controller('Ctrl', function ($scope) {
$scope.teams = [
{
id: 100,
name: "A Team",
count_win: 1,
count_loose: 2,
goal_average: 1
},
{
id: 200,
name: "C Team",
count_win: 2,
count_loose: 3,
goal_average: 4
},
{
id: 300,
name: "B Team",
count_win: 4,
count_loose: 1,
goal_average: 8
}
];
$scope.predicate = 'name';
});
당신의 데이터가 담긴 데모를 가지고 바이올린을 만들었습니다.
언급URL : https://stackoverflow.com/questions/23920028/angularjs-orderby-on-ng-repeat-doesnt-work
'programing' 카테고리의 다른 글
angular.js를 사용하여 입력 상자를 비활성화하는 방법 (0) | 2023.03.02 |
---|---|
단순 js 코드에서 angularjs 서비스를 호출합니다. (0) | 2023.03.02 |
JSX(React)에서 곱슬머리 괄호는 무엇을 의미합니까? (0) | 2023.03.02 |
JSON 문자열에서 C# 클래스 파일을 자동 생성하는 방법 (0) | 2023.03.02 |
WooCommerce csv 사용자 지정 필드 가져오기 - 사용자 지정 필드를 포함하도록 기본 제공 임포터를 조정하시겠습니까? (0) | 2023.03.02 |