Angular 1.5.x with ngAnimate still do multiple $digest

[KrakenTyio]

Hi,

after updating angular 1.5.1 with ngAnimate is still there bug with multiple triggering $digest.

Problem - Multiple opening same uiSelect triggering duplicity $digest`s.

This bug was ignored with reference to bug on ngAnimate 1.5.0.

Im updated uiSelect 0.16.0 but still its not working propertly.

For now i changed code like this:

ctrl.$animate = (function () {
try {
// return $injector.get('$animate');
return null;
} catch (err) {
// $animate does not exist
return null;
}
})();

[wesleycho]

You should post a reproduction - this is not a useful issue with the information mentioned.

[KrakenTyio]

ok here is plunkr:
http://plnkr.co/edit/mSczuVKBSmoJJh54gziT?p=preview

Test process

• Open console,
• Try open 2-5 times same select box,
• You`ll see multipliing result of console.log('digest cicle');

Results

• 1 Time opening 1. select box - 2 digest(default) + 9 digests (1select box + 8 items in select box)
• 2 Time opening 1. select box - 2 digest(default) + 17 digests (9 prev digests + 8 items in select box)
• 3 Time opening 1. select box - 2 digest(default) + 25 digests (17 prev digests + 8 items in select box)
  .....
  Second select box showing all 243 items, and triggering + 244 digest cicles

This killing slower computers.

Everything work corectly when you turn off ngAnimate or just ctrl.$animate return false state.

tested in chrome, bc ff is dead after 5-10 iterations

[glowysourworm]

+1 also seeing really poor jQuery related performance during mouse interaction. don't have time to refactor this code.. switching to select2 4.0.2 and creating my own angular wrapper

[Samic8]

I have replicated the issue in our own web app and in the plunkr linked by @KrakenTyP-co

[nevadascout]

I have also replicated this in the supplied plunkr and in my own web app.

My ui-select has over 800 items and it is virtually unusable with $animate enabled.

[JasonTheProgrammer]

Also adversely affected by this. My workaround was to use the $animate service to disable animation on the ui-select element like $animate.enabled(element, false);, per https://docs.angularjs.org/api/ng/service/$animate#enabled

Although, as I test further, I see I was inadvertently disabling all animation, not just the animation for that element...

[gscoppino]

We've also been having some performance issues with ui-select, specifically with lists of over 100 items. Disabling AngularJS driven animations by removing the ngAnimate module significantly improves perceived performance as noted. However, we only want to disable animations for ui-select and want other parts of our app to continue using AngularJS driven animations. @KrakenTyio 's solution works perfectly and is easily verifiable from looking at the code base (at least as the time of this writing).

In addition, there is a way to make the change on a per-instance basis and without forking the repository or keeping a locally modified copy of the library. We created a directive that requires uiSelect as a sibling and sets the instance of $animate to null, like so:

angular.module('my-module')
    .directive('uiSelectNoAnimate', () => ({
        restrict: 'A',
        require: 'uiSelect',
        link: (scope, element, attrs, $select) => {
            $select.$animate = null;
        }
    }));

and use as follows:

<ui-select ui-select-no-animate ...>...</ui-select>