Error using ngOptions with objects containing circular references

[dubejf]

The new ngOptions in Angular 1.4-beta doesn't handle objects containing circular references well.

Steps to reproduce:

1. Define a ng-options with ng-model. At least one of the items in the source array must be a recursive object (such as a Breeze entity).
2. Select the recursive object.
3. Uncaught RangeError: Maximum call stack size exceeded is printed on the console.

http://jsfiddle.net/dubejf/tn102eh8/ (using 1.4.0-beta6)

The watcher of ngModel, set by the ngOptionsDirective, compares the selected item with the last value by deep equality (using angular.equals). When a recursive object is selected, this causes the stack to blow up (as described in #7724).

Using track by doesn't alleviate the problem.

This error is not reproducible in Angular 1.3.

[mgbee8]

I can confirm and reproduce this error with Breeze entities, it was working correctly in beta5 but beta6 displays this behavior

[dubejf]

You're right, it was broken by this commit: 6a03ca2

[booleanbetrayal]

#11448 offers a way to work around this issue, provided you aren't trying to use track by

[petebacondarwin]

Having landed #11448 I can see that this bug appears to be fixed: http://jsfiddle.net/L9vqc9ew/

[dubejf]

Yes, this bug is fixed in 1.4.0-rc.0, as long as you are not using track by. track by with cyclic objects still gives an error, but that regression seems less important.

In any case, with the recent performance optimizations to ngOptions (identity comparison, no copies), is it fair to say to track by should be avoided when using objects with ngOptions? As opposed to ngRepeat, where the guideline appears to be to use track by whenever possible.

[pranaydutta89]

👍