如何在数组中分配随机颜色？

Question

嘿，我有一个不同颜色的数组，我希望每个创建的芯片都有这个数组的随机颜色。我试图将所有颜色的字符串放在数组中，然后查看芯片是否使用数组之后的颜色创建。但那并没有奏效。我怎样才能做到这一点？

HTML

<ion-chip [color]="color" class="chip" #chip *ngFor="let tag of tagName">

TS

 public color: string [] = ["ok", "nice","awesome","danger","white"]

标签名称

export class Tag {
  tag: string;
  constructor(values: Object = {}) {
    Object.assign(this, values);
  }

...

  tagName: Tag[] = [];

...

  add(): void {
      let id = this.tagName.length + 1;
      this.tagName.push(new Tag({ tag: "tag" + id }, ));
    }

    remove(tag: Tag) {
      let id = this.tagName.indexOf(tag);
      this.tagName.splice(id, 1);
    }

Answer 1

getRandomColor() {
var color = Math.floor(0x1000000 * Math.random()).toString(16);
return '#' + ('000000' + color).slice(-6);
}

截图：

Answer 2

你需要做的是生成一个随机索引，从0到数组的长度：

getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

然后，设置颜色如下：

[color]="color[getRandomInt(color.length)]"