Using AngularJS how could I randomize the order of a collection? Using AngularJS how could I randomize the order of a collection? angularjs angularjs

Using AngularJS how could I randomize the order of a collection?


EDIT Warning!: These results are skewed, don't use this. This answer is only left as a warning until further editing.

Explanation: There should be an equal chance of any item being in the first position, but the actual percent chance after 10,000 iterations of, for example, 6 items, ends up being

1: ~28%, 2: ~10%, 3: ~14%, 4: ~20%, 5: ~12%, 6: ~15%

https://jsfiddle.net/sh0ber/km9cqvpf/

orderBy can take a function parameter, just like array.sort so you can use your HTML above and define a function random on the scope like:

$scope.random = function(){    return 0.5 - Math.random();};

This will return a random value sometimes negative, sometimes positive, sometimes 0, which will randomly sort the array.


Doing a quick fiddle sh0ber method seems to work well:http://jsfiddle.net/owenmead/fa4v8/1/

<div ng-controller="MyCtrl">  <p ng-repeat="i in list|orderBy:random">{{i}}</p></div>function MyCtrl($scope) {  $scope.list = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];  $scope.random = function() {    return 0.5 - Math.random();  }}

Angular's orderBy uses JavaScript's sort() on a copy of the list. Looking at another answer, certain browsers are stable in their sort, others are not. Perhaps just test the fiddle in a few browsers and you should be good to go:Array.sort Sorting Stability in Different Browsers

PS. Couldn't comment on sh0ber's answer as I don't have 50 rep