Shuffle ng-repeat results

Question

I have some data in Firebase and I'm puting it on my website and filter them. I want to show just 4 random items with property "cheap: true". Unfortunetaly I don't have any idea how can I shuffle this output. I created random function, but it causes an error:

[$rootScope:infdig]

I'd be very grateful if you could help me with shuffling these 4 results. Here is my code:

HTML:

<div ng-repeat="place in places | filter: {cheap: 'true'} | limitTo: 4 | orderBy: random" class="col-lg-3">

JS:

// Random order by
    $scope.random = function() {
      return 0.5 - Math.random();  
    };

And my Firebase data is here:

// Firebase
    $scope.places = $firebaseArray(ref);

Duplicate of [random-orderby-in-angularjs-1-2-returns-infdig-errors](http://stackoverflow.com/questions/21586369/random-orderby-in-angularjs-1-2-returns-infdig-errors) — Jins Peter, Apr 25 '17 at 12:28
try this http://stackoverflow.com/questions/21586369/random-orderby-in-angularjs-1-2-returns-infdig-errors — Jins Peter, Apr 25 '17 at 12:30
I know this solution, but unfortunately it doesn't work. It doesn't return any items. — , Apr 25 '17 at 12:37

score 0 · Answer 1 · edited May 23 '17 at 12:34

0

You could have a filter return a randomized splice.

<li ng-repeat="item in array | randomSample:4">{{ item }}</li>

Try this solution - http://plnkr.co/edit/NgsQlvgrCD7vLXnBC7q1?p=preview

(posted on this question Angular JS ng-repeat choose random grouping from array?)

edited May 23 '17 at 12:34

Community

1
1

answered Apr 25 '17 at 12:38

Grant

5,709
2
38
50

Nope :( Error: [$injector:unpr] " – Apr 25 '17 at 12:40

score 0 · Answer 2 · edited May 23 '17 at 12:17

You can try like below.. Refer AngularJS ng-repeat random order

var app=angular.module("myapp", []);
  app.controller("namesctrl", function($scope,$http,$window){
 
        $scope.tickets = [{
                "id": 1
            },{
                "id": 2
            },{
                "id": 3
            },{
                "id": 4
            },{
                "id": 5
            },{
                "id": 6
            },{
                "id": 7
            }];
     
      function sort(array) {
        return array.sort(function() {
            return .5 - Math.random();
        });
      }

      function random() {
        for (var key in $scope.tickets) {
          $scope.tickets = sort($scope.tickets);
        }
      }      
      random();

  });

 <script Src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.3/angular.js"></script>
<body ng-app="myapp" ng-controller="namesctrl">
    <ul>
        <li ng-repeat="item in tickets">
        {{item.id}} {{item}}
        </li>
    </ul>
</body>

Shuffle ng-repeat results

2 Answers2