-1

I have array of objects in my custom angularJS filter. The array of object has the featured key with boolen true and false property. I get the object with all the featured true values. Now i want to shuffle the featured true object data. But unfortunately, it is giving me digest infinite error.

My Code:

   app.filter('sortFilter', ['$filter', function ($filter) {
   return function (items, sort) {
      var onlyFeatured = [];
            angular.forEach(items, function (item, key) {
                if(item['featured'] == true) {
                    onlyFeatured.push(items[key]);
                } 
            });
            onlyFeatured.sort(function() { return 0.5 - Math.random(); 
            });
            return onlyFeatured; 
       };
});

Please help to get rid from digest error.

user10325645
  • 11
  • 3
  • The sorting function should be deterministic, otherwise you won't (necessarily) get a very random output. – VLAZ Sep 27 '18 at 14:29
  • 1
    Possible duplicate of [How to randomize (shuffle) a JavaScript array?](https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array) – VLAZ Sep 27 '18 at 14:29
  • @vlaz I don't think the `sort` is the cause of this error. OP, what is the full error message, please? – Phil Sep 27 '18 at 14:30
  • Yes, I doubt `.sort` is *the* problem. But in its current form it is *a* problem. – VLAZ Sep 27 '18 at 14:31
  • **Uncaught Error: [$rootScope:infdig]** this is the error getting. – user10325645 Sep 27 '18 at 14:32
  • It is working fine if i removed the random function. But with random function getting the digest error. – user10325645 Sep 27 '18 at 14:32
  • So that's an AngularJS error. How are you attempting to use this filter of yours? – Phil Sep 27 '18 at 14:32
  • My data is coming in array of objects like: [{'id': 1,'name': 'abc', 'featured': true},{'id': 1,'name': 'abc', 'featured': false}]. – user10325645 Sep 27 '18 at 14:34
  • This is the data coming from the items inside filter. – user10325645 Sep 27 '18 at 14:35

1 Answers1

1

Root cause: your filter returns new Array on each digest cycle. And angularjs performs dirty check for each observed value. Since it gets new array it runs digest again. And gets another one array. And ... this happens for some_limit_typically_10 times and then it fails.

So it is not possible to implement randomizer as angularjs filter.

Instead you need to shuffle it once somewhere in your component and insrt result into $scope or controller's this variable

[UPD] I was wrong on point that .sort does not mutate original array. It does, sorry for misinformation. But anyway it would not help.

skyboyer
  • 22,209
  • 7
  • 57
  • 64
  • Can you please provide me some example.? – user10325645 Sep 27 '18 at 14:41
  • do you have some sample code of your component that needs shuffled data? – skyboyer Sep 27 '18 at 14:43
  • [{'id': 1,'name': 'abc', 'featured': true},{'id': 1,'name': 'abc', 'featured': false}]. This is the sample data. – user10325645 Sep 27 '18 at 14:44
  • I tried with console log array of objects. There is multiple records showing with **Uncaught Error: [$rootScope:infdig]** this digest error. – user10325645 Sep 27 '18 at 14:46
  • Like i have 18 records with 3 each in a row. When i execute console log without random sort function, it is giving me accurate 6 objects (6*3=18). But with the random function it takes it to infinite objects. Don't know why. – user10325645 Sep 27 '18 at 14:49
  • '[$rootScope:infdig]' means 'infinite digest cycle'. I've described why it happens. Under 'some sample code' I mean you should have some component that rely on that shuffled data, right? So show me component's code and I'll provide you with updated version where shuffling happens inside the component – skyboyer Sep 27 '18 at 14:52
  • Actually, i have a filter which chnages the featured records and ascending order sort. The client wants to change the order of featured partner everytime when perform sort through selection. – user10325645 Sep 27 '18 at 14:58
  • One thing need to ask. Can i allow random function to make the similar indexing those once created first time throughout the ng-repeat loop.? – user10325645 Sep 27 '18 at 15:24
  • sorry, I don't understand what indexing do you mean. There is no `ng-repeat` in your code to get meaning from code. So better show some code when you planned to use `sortFilter` – skyboyer Sep 27 '18 at 16:48
  • Thanks skyboyer for your time. I created the solution in different way and it works! Do you have skype account.? It will be good to be together for sharing programming ideas, if you never mind.:-) – user10325645 Sep 27 '18 at 19:30