Question

我想在单击事件中选择多个图像选择，就像您可以说选择多个类别并根据所选类别显示数据一样，其他类别将显示未选中。选定的img将显示不同的背景，而未选定的img将显示不同的背景。我的代码在下面，但我不知道如何执行此操作。请帮助我

.html

<div class="iconcircle" *ngFor="let robot of categories; let i = index">
            <div class="iconcircle-media" *ngIf="robot.checked === 'true'; else template">
            <img class="img-responsive" src="{{robot.checked}}"/>
          </div>
          <ng-template #template>
            <img class="img-responsive" src="{{robot.checked}}"/>
          </ng-template>
        </div>

.iconcircle {
      background: #041e3b;
      border-radius: 50%;
      width: 76px;
      padding: 23px;
      color: #fff;
      margin: 0px auto;
      margin-bottom: 10px;
      height: 76px;
  }

.ts文件

 CheckboxClicked(state, item: any) {
    console.log("state: ", state.target.checked);
    if (state.target.checked) {
      window.localStorage.setItem("checkForNull","0");
      this.selectedCategories.push(item.key);

      console.log("this.selectedCategories",this.selectedCategories);

    }
    else {
      let index = this.selectedCategories.indexOf(item.key);
      this.selectedCategories.splice(index, 1);
      window.localStorage.setItem("checkForNull","0");

      console.log("this.selectedCategories",this.selectedCategories);

      if(this.selectedCategories.length == 1 || this.selectedCategories.length == 20 || this.selectedCategories.length == 0)
      {
      window.localStorage.setItem("checkForNull","1");
      this.selectedCategories = [];
      }
    }
  }

这是复选框选择和取消选择的方法，但是我想在html中单击img。请帮助我，我有麻烦了。

ionic3选项的多重选择？

0 个答案: