CODEWITHSUNDEEP
angular
Leela Narasimha
Leela Narasimha

Reputation: 140

Using the method in ngclass results Expression has changed after it was checked

I am using the method in the ngclass which loops in the ngfor. All the time the method return value changes when the looping does.

But i am getting an error like

ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'background_pink'. Current value: 'background_blue'.

The code is like this

component.ts

getRandomColor() {
    const changedColor = _.sample(this.colors);
    return changedColor;
}

component.html

<a href="https://www.leelag.com/tag/laravel" *ngFor="let tag of bookDetails.tags">
<label [ngClass]="['label', 'well', 'well-sm', getRandomColor()]">{{ tag.name }}</label></a>

All the time when looping it is displaying the above error. How to solve this?

Upvotes: 0

Views: 981

Answers (1)

user8112829
user8112829

Reputation:

It seems you are updating your variable/value within loop code.

*ngFor will not understand the updated value when it's loop iterate in logic.

Upvotes: 0

Related Questions