Angular $ animate.enabled: disable element animation

Question

I had a problem using the $ animate.enabled method to programmatically disable and enable animation for this element (via the directive). There are many solutions on the Internet that use this technique, so I can only assume that I am missing something, but I tried to write in several different ways without success.

The $ animate.enabled method is overloaded to perform two operations:

• $animate.enabled(Boolean): Turn on or off animations worldwide.
• $animate.enabled(Boolean, AngularElement): Enables or disables the animation for this item.

One would expect that if the global form disables the animation successfully, the target form should do the same (for the target element), but here is an example that this does not happen:

http://plnkr.co/edit/6if3nkgJdMHcnUrpcbVh?p=preview

For some people with similar problems, the problem ended up as the first argument was not actually logical. Check the console on this plnkr to see what the argument is Boolean.

In my actual project, the directive that I wrote for this is as follows:

cruncher.directive('crAnimateWhen', function($animate) {
    return {
        restrict: 'A',
        link: function(scope, elem, attr) {
            scope.$watch(function() {
                return scope.$eval(attr.crAnimateWhen);
            }, function(shouldAnimate) {
                $animate.enabled(shouldAnimate, elem);
            });
        }
    };
});

The meaning of "shouldAnimate" goes loud and clear; this does not seem to be an attribute rating issue.

I know that there are many other approaches to selectively disabling angular animation (I used them before, successfully). I probably just use one of these approaches - but nonetheless I really want to know why this code does not work.

---

Edit: I must, of course, mention that I use angular and ngAnimate 1.3.9, since this material is so often associated with the version, but Plnkr is 1.3.0 and it shows the same behavior.