Plnkr: http://plnkr.co/edit/Q34J9szbLeGgc4jkcNUM?p=preview
我有一个称为标签的简单数组,其中包含4个具有tweets值和vol值的对象。
当我单击Tweets 的顺序或Vol 的顺序按钮时,我希望数字是有意义的,例如从高到低或从低到高,但是数字是乱序。
标记: <div class="sidebar" ng-controller="sidebar">
<header class="my-header">
<button ng-click="reOrderByTweets()">Order by Tweets</button>
<button ng-click="reOrderByVol()">Order by Vol</button>
</header>
<ul>
<li ng-repeat="t in tags" ng-mouseleave="leaveTag(t)">
<div class="tag-container">
<div class="tag border1"
ng-mouseover="showTagDetails(t)">{{t.name}} | tweets: {{t.tweets}} | vol: {{t.vol}}</div>
<tag-details tag="t"></tag-details>
</div>
</li>
</ul>
</div>
JavaScript:$scope.tags.push(
{
name: 'Item 1 ',
tweets: '412',
vol: '50'
},
{
name: 'Item 2 ',
tweets: '10',
vol: '500'
},
{
name: 'Item 3 ',
tweets: '67',
vol: '5'
},
{
name: 'Item 4 ',
tweets: '0',
vol: '30'
}
);
功能:function reOrderByTweets() {
console.log('reOrderByTweets');
vs.orderReverse = !vs.orderReverse;
$scope.tags = $filter('orderBy')($scope.tags, 'tweets', vs.orderReverse);
console.log('vs.orderReverse = ', vs.orderReverse); // true or false
console.log('$scope.tags = ', $scope.tags);
}
function reOrderByVol() {
console.log('reOrderByVol');
vs.orderReverse = !vs.orderReverse;
$scope.tags = $filter('orderBy')($scope.tags, 'vol', vs.orderReverse);
console.log('vs.orderReverse = ', vs.orderReverse); // true or false
console.log('$scope.tags = ', $scope.tags);
}
如您所见,下面的屏幕截图是按和排序的。含vol:5
的项目应位于vol:30
之后
更新:似乎只在数字的第一个数字上过滤?为什么不取全部数字?
按一下推文过滤:
按第二次点击的推文过滤:
最佳答案
您正在按按字母顺序完成的字符串值进行排序。
'10'
'5'
'30'
字符串顺序为10/30/5。
将“vol”和“tweets”更改为数字:
$scope.tags.push(
{
name: 'Item 1 ',
tweets: 412,
vol: 50
},
{
name: 'Item 2 ',
tweets: 10,
vol: 216
},
{
name: 'Item 3 ',
tweets: 67,
vol: 15
},
{
name: 'Item 4 ',
tweets: 0,
vol: 30
}
);
正确分类您的推文。
关于javascript - 为什么我的ng-repeat项目在这里没有按预期进行过滤?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32298987/