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

Question

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

HTML

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

TS

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

的tagName

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);
}

ScreenShot：

Answer 2

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

[22003] - SQLSTATE[22003]: Numeric value out of range: 1690 BIGINT UNSIGNED value is out of range in '(`zurmogt`.`campaign_read`.`count` - 1)'
REQUEST_URI=/app/index.php/users/default/edit?id=96
HTTP_REFERER=myurl.com/app/index.php/users/default/edit?id=96
---
2018/04/25 13:26:23 [warning] [application] Exception class: RedBean_Exception_SQL
#0 /home/prod/releases/20170222074235/redbean/rb.php(777): RedBean_Driver_PDO->runQuery('update campaign...', Array)
#1 /home/prod/releases/20170222074235/redbean/rb.php(1779): RedBean_Driver_PDO->Execute('update campaign...', Array)
#2 /home/prod/releases/20170222074235/redbean/rb.php(7534): RedBean_Adapter_DBAdapter->exec('update campaign...', Array)
#3 /home/prod/releases/20170222074235/redbean/rb.php(7440): RedBean_Facade::query('exec', 'update campaign...', Array)
#4 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(962): RedBean_Facade::exec('update campaign...')
#5 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(1022): ReadPermissionsOptimizationUtil::decrementCount('campaign_read', 29092, Object(Role))
#6 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(1023): ReadPermissionsOptimizationUtil::decrementParentRolesCounts('campaign_read', 29092, Object(Role))
#7 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(1023): ReadPermissionsOptimizationUtil::decrementParentRolesCounts('campaign_read', 29092, Object(Role))
#8 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(1023): ReadPermissionsOptimizationUtil::decrementParentRolesCounts('campaign_read', 29092, Object(Role))
#9 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(1053): ReadPermissionsOptimizationUtil::decrementParentRolesCounts('campaign_read', 29092, Object(Role))
#10 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ReadPermissionsOptimizationUtil.php(824): ReadPermissionsOptimizationUtil::bulkDecrementParentRolesCounts('campaign_read', Array, Object(Role))
#11 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/AllPermissionsOptimizationUtil.php(385): ReadPermissionsOptimizationUtil::userBeingRemovedFromRole(Object(User), Object(Role))
#12 /home/prod/releases/20170222074235/app/protected/modules/users/models/User.php(300): AllPermissionsOptimizationUtil::userBeingRemovedFromRole(Object(User), Object(Role))
#13 /home/prod/releases/20170222074235/app/protected/core/models/RedBeanModel.php(1909): User->beforeSave()
#14 /home/prod/releases/20170222074235/app/protected/modules/zurmo/models/Item.php(123): RedBeanModel->save(false, NULL)
#15 /home/prod/releases/20170222074235/app/protected/modules/users/models/User.php(244): Item->save(false, NULL)
#16 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ZurmoControllerUtil.php(159): User->save(false)
#17 /home/prod/releases/20170222074235/app/protected/modules/zurmo/utils/ZurmoControllerUtil.php(109): ZurmoControllerUtil->saveModelFromSanitizedData(Array, Object(User), false, 'Lora Chandra', false)
#18 /home/prod/releases/20170222074235/app/protected/modules/users/controllers/DefaultController.php(326): ZurmoControllerUtil->saveModelFromPost(Array, Object(User), false, 'Lora Chandra')
#19 /home/prod/releases/20170222074235/app/protected/modules/users/controllers/DefaultController.php(244): UsersDefaultController->attemptToSaveModelFromPost(Object(User), NULL)
#20 [internal function]: UsersDefaultController->actionEdit('96')
#21 /home/prod/releases/20170222074235/yii/framework/web/actions/CAction.php(109): ReflectionMethod->invokeArgs(Object(UsersDefaultController), Array)
#22 /home/prod/releases/20170222074235/yii/framework/web/actions/CInlineAction.php(47): CAction->runWithParamsInternal(Object(UsersDefaultController), Object(ReflectionMethod), Array)
#23 /home/prod/releases/20170222074235/yii/framework/web/CController.php(308): CInlineAction->runWithParams(Array)
#24 /home/prod/releases/20170222074235/yii/framework/web/filters/CFilterChain.php(133): CController->runAction(Object(CInlineAction))
#25 /home/prod/releases/20170222074235/yii/framework/web/CController.php(291): CFilterChain->run()
#26 /home/prod/releases/20170222074235/yii/framework/web/CController.php(265): CController->runActionWithFilters(Object(CInlineAction), Array)
#27 /home/prod/releases/20170222074235/yii/framework/web/CWebApplication.php(282): CController->run('edit')
#28 /home/prod/releases/20170222074235/yii/framework/web/CWebApplication.php(141): CWebApplication->runController('users/default/e...')
#29 /home/prod/releases/20170222074235/yii/framework/base/CApplication.php(185): CWebApplication->processRequest()
#30 /home/prod/releases/20170222074235/app/protected/core/components/WebApplication.php(88): CApplication->run()
#31 /home/prod/releases/20170222074235/app/index.php(73): WebApplication->run()
#32 {main}

然后，设置颜色如下：

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