在 AngularJS 中对数组进行排序

sort array in angularjs

本文关键字：排序 数组 AngularJS      更新时间：2023-09-26

我正在使用orderBy使用Angular JS对数组进行排序。但它仍然没有在特定键上排序。

这是代码 

var app = angular.module('sortModule', [])
app.controller('MainController', function($scope,$filter){    
$scope.languages = [ 
        { name: 'English', image: '/images/english.png',key:2 },
        { name: 'Hindi', image: '/images/hindi.png',key:3 },
    { name: 'English', image: '/images/english.png',key:2},
    { name: 'Telugu', image: '/images/telugu.png',key:1 }];        
var newLanguages = []
newLanguages = angular.copy($scope.languages);  
function sortImages() { 
        $scope.languages = []
    $scope.keys = []        
        for(language in newLanguages) {
            $scope.keys.push(newLanguages[language])
    }
    $filter('orderBy')($scope.keys, 'key')
    console.log(JSON.stringify($scope.keys))
}
sortImages();

}）;

小提琴

我计划查看基于"键"的排序。 泰卢固语应该排在第一位，英语排在第二位，印地语排在最后。

你需要有：

$scope.keys = $filter('orderBy')($scope.keys, 'key', false)

排序依据过滤器返回一个新数组，它不会对传递的数组进行更改。

更新的小提琴：http://jsfiddle.net/kjuemhua/17/

从 html 标记中删除 OrderBy 以显示无序列表：

<div ng-app="sortModule" class="nav">
<div ng-controller="MainController">

    <button ng-click="sort()">Sort  
    </button>
    <div></div>
    <div >        
        <ul>
            <li ng-repeat="lang in languages">
               <span>{{lang.name}}</span>
            </li>
        </ul>
    </div>
    </div>
</div>

现在使用按钮对列表进行排序

var app = angular.module('sortModule', [])
app.controller('MainController', function($scope,$filter){    
    $scope.languages = [ 
            { name: 'English', image: '/images/english.png',key:2 },
            { name: 'Hindi', image: '/images/hindi.png',key:3 },
        { name: 'English', image: '/images/english.png',key:2},
        { name: 'Telugu', image: '/images/telugu.png',key:1 }];        
    var newLanguages = []
    newLanguages = angular.copy($scope.languages);  
    $scope.sort = function(){ 
            $scope.languages = []
        $scope.keys = []        
            for(language in newLanguages) {
                $scope.keys.push(newLanguages[language])
        }
        $scope.keys = $filter('orderBy')($scope.keys, 'key', false);
        $scope.languages = $scope.keys;
        console.log(JSON.stringify($scope.keys))
    }
});
相关文章：