ionSideMenu is-enabled Firing 20+ Times

#1

I’ve added the is-enabled property with a function call:

<ion-side-menu side="left" width="205" is-enabled="shouldSideMenuBeEnabled()">

The function is declared in my main app controller.

$scope.shouldSideMenuBeEnabled = function() {
    return true;
}

The issue is that this function is getting called 15-30 times on every screen change. That sounds like animation keyframing or something, but it’s definitely not what I expected and it can’t be good for performance. I could change it to be a boolean, but that would still be referenced way too often.

Am I doing something wrong?

Thanks

#2

To confirm it wasn’t any conflicting code from my project, I created this on a new project and see the same number of calls being made.

#3

yeah this is the standard angularjs behave :smiley:.

For every refresh cycle (digest) of the scope, all watchers are called and executed. This is the “magic” behind the two-way-databinding.

There are many changes on the scope or rootScope during a state-change and because of that your function is called multiple times.

A simple example: If you have an array on your scope. In the template the items are used in a ng-repeat. For every change in that array the ng-repeat rerenders it (in most cases).
So if you are changing an array --> do it in a temporary one and after you have finished your changes --> put them back on the scope.

#4

The way I’m solving it is by putting my menu render logic in a STATECHANGESUCCESS handler which sets a boolean. Then I set ng-if to that boolean. This seems much better for perf, but I sure wish I could use the is-enabled flag since it disables menu swiping as well.

Maybe a better thing would be to keep the logic in the state change handler and point is-enabled to the boolean.