CODEWITHSUNDEEP
angularjsangularjs-controller
Ian Vink
Ian Vink

Reputation: 68780

Angular evaluating ng-show slowly

I have a simple verification that evaluates in my controller:

<span class="....." ng-show="!ruleHasAnsweredQuestions()">
    Please answer all questions</span>

In the controller:

$scope.ruleHasAnsweredQuestions  = function() { return a+b+c>9; }

It's really slow though, taking 1/2 second or so to re-evaluate "a", "b" or "c" changes.

In a general sense, how can I speed up the UI so that once a,b,c changes, the UI is updated faster?

Upvotes: 0

Views: 273

Answers (3)

Ian Vink
Ian Vink

Reputation: 68780

Turns out I had added "Animate.css" and the directive 'ngAnimate' to the elements causing a double long animation.

Removing Animate.css fixed it

Upvotes: 0

Kais
Kais

Reputation: 2008

Use this. test done in this plunker:

 <span  ng-show="(a+b+c) > 9">
  Please answer all questions
</span>

Upvotes: 0

greengrassbluesky
greengrassbluesky

Reputation: 373

You can add ng-cloak 

<span class="....." ng-show="!ruleHasAnsweredQuestions()" ng-cloak>

This will prevent the delay.

According to angular js documentation, ng-cloak works by temporarily hiding the marked up element and it does this by essentially applying a style that does this:

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

Upvotes: 1

Related Questions