Plnkr: http://plnkr.co/edit/Q34J9szbLeGgc4jkcNUM?p=preview
我有一个名为tags的简单数组,其中包含4个具有推文值和卷值的对象。
当我点击按推文订购或按订单排序按钮时,我希望数字有意义,例如从高到低或从低到高,但是这些数字不合时宜。
标记:
<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 订购时看到的屏幕截图所示。包含vol:5
的项目应该在vol:30
更新:看起来它只是过滤了数字中的第一个数字?为什么不采取整个数字?
按推文过滤一次:
通过推文过滤第二次点击: