Несколько вариантов выбора ionic3? - PullRequest
Новая
       6

Несколько вариантов выбора ionic3?

0 голосов
/ 25 октября 2018

Я хочу выбрать выбор нескольких изображений для события клика, например, вы можете сказать выбор нескольких категорий и отобразить данные в соответствии с выбранными категориями, а другие категории будут показаны как невыбранные.Выбранный 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 file 

 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 = [];
      }
    }
  }

Это метод для выбора и отмены выбора флажка, но я хочу это для клика на imgв HTML.Пожалуйста, помогите мне, у меня проблемы.

...