"groupBy" throws Converting circular structure to JSON

[stubbies]

I have something like this:

users = [
     { id: 1, location: "Japan", location_id: 1},
     { id: 2, location: "Germany", location_id: 2},
     { id: 5, location: "Germany", location_id: 2},
     { id: 3, location: "France", location_id: 3},
     { id: 4, location: "France", location_id: 3}
]

  <li ng-repeat="(key, value) in users | groupBy: 'location_id'">
     {{key}}
  </li>

Getting TypeError: Converting circular structure to JSON at Object.stringify (native)

It works with countBy but with that I don't have access to location, and I can't do this:

- Germany (2)
- France (2)
- Japan (1)

[a8m]

Can you please provide some fiddle/jsbin example?
Thanks @Errvald

[a8m]

PTAL @Errvald - example

[hughes]

I also ran into this today, but for some reason can't reproduce it when recreating a circular reference in the example...

[Wasmoo]

groupBy tries to create a hash out of the arguments using toJson, which dies on circular references. To recreate, use objects that refer to each other, as in this example:

http://plnkr.co/edit/41jlNbrITkz8WSUbybV5?p=preview

[Wasmoo]

JSFiddle version
https://jsfiddle.net/WASMOO/tezjudL0/2/

[Wasmoo]

The following code is a temporary hack that works for me (replacing function getHashKey near angular-filter.js:2092)

    /**
     * Creates a copy of the given object, but replaces duplicate children
     * @param  orig The object to copy
     * @param  objs Array of objects that were already found
     * @return the resulting copy
     */
    var getHashHelper = function(orig, objs) {
      //Primitives are not copied
      if (!isObject(orig)) {
        return orig;
      }

      //Return replacement if reference already exists
      var index = objs.indexOf(orig);
      if (index !== -1) {
        return 'HashHelperObject:'+index;
      }

      //Add this object to the reference list
      objs.push(orig);

      //Recursively create a copy of orig
      var copy;
      if (isArray(orig)) {
        copy = [];
      } else {
        copy = {};
      }

      for (var n in orig) {
        copy[n] = getHashHelper(orig[n], objs);
      }

    };

    /**
     * @description
     * get `HashKey` string based on the given arguments.
     * @param fName
     * @param args
     * @returns {string}
     */
    function getHashKey(fName, args) {
      return [fName, angular.toJson(getHashHelper(args, []))]
        .join('#')
        .replace(/"/g,'');
    }

[PureDeveloper]

I tried this temp hack and get the following error of:

Error: Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('file') does not support selection.
    at Error (native)

The error points to something to do with:

copy[n] = getHashHelper(orig[n], objs); 

Any ideas?

[a8m]

Fixed via 0.5.7
I'm closing it. If there's still any problem, do not hesitate to reopen.

Thanks.

[PureDeveloper]

@a8m, that fixed it. Thanks for the fast response and fix.

[deepthiravadi]

Hi, I am getting this error
5angular.js:11699 TypeError: Converting circular structure to JSON
at Object.stringify (native)
at http://192.168.32.163/js/angular/angular.min.js:6:387
at http://192.168.32.163/js/angular/angular.min.js:234:494
at Object.fn (http://192.168.32.163/js/angular/angular.min.js:123:30)
at m.$digest (http://192.168.32.163/js/angular/angular.min.js:124:114)
at m.$apply (http://192.168.32.163/js/angular/angular.min.js:127:12)
at l (http://192.168.32.163/js/angular/angular.min.js:81:327)
at P (http://192.168.32.163/js/angular/angular.min.js:85:449)
at XMLHttpRequest.H.onload (http://192.168.32.163/js/angular/angular.min.js:86:462)

I tried your hack,but no luck.can you please help.Thanks!

[a8m]

Hi @deepthiravadi
Can you please provide some fiddle/jsbin that demonstrate that?

Thanks.

[deepthiravadi]

Sorry, I cant do that..I didnt write the code and the js files are so many ,so i dont know the code.But it loads a gnatt chart for a project and it loads for all other projects except for this one.It throws that error.Iam trying to console.log outputs but no clue whats causing it..The array has objects and child objects.