[SOLVED] how to make a material badge code simpler and easier without using indexof

Issue

This is the code for the material badge that needs to be fixed, it should already have the index saved starting from zero and increments and it shouldn’t use indexOf or color index and the property should be changed to number instead of string so it doesn’t make loops to find the index so the code is cleaner and faster.

 badgesColorSet = ['#ffff00', '#f51307', '#0cc902'];
  badgesColorSelected: string;

  getIteriateColor() {
    if (!this.badgesColorSelected) {
      this.badgesColorSelected = this.badgesColorSet[0];
    } else {
      const colorIndex = this.badgesColorSet.indexOf(this.badgesColorSelected);
      if (colorIndex + 1 > this.badgesColorSet.length - 1) {
        this.badgesColorSelected = this.badgesColorSet[0];
      } else {
        this.badgesColorSelected = this.badgesColorSet[colorIndex + 1];
      }
    }
  }

I’ve tried making it faster and removed the index of but it didn’t work

Solution

getIteriateColor() {

if (!this.badgesColorSelected) {
  this.badgesColorSelected = 0;
} else {
  const colorIndex = this.badgesColorSelected;
  if (colorIndex + 1 > this.badgesColorSet.length - 1) {
    this.badgesColorSelected = this.badgesColorSet[0];
  } else {
    this.badgesColorSelected = this.badgesColorSet[colorIndex + 1];
  }
}
console.log('current color is: ', this.badgesColorSelected);

return this.badgesColorSelected;

}
}
I think someone more equipped with knowledge in angular should continue and help you out

Answered By – Connor Demachikeh

Answer Checked By – Mary Flores (BugsFixing Volunteer)