Как предотвратить выбор флажка all при установке его переменной в true или false?

Question

Я создал список аккордеонов с ionic [v3] , как вы можете видеть в видеоруководстве по ссылкам, меню выбора выбора нет в файле .html. Элементы списка в меню взяты из файла .json, как вы можете видеть в моем файле .ts

form.html

    .....
    <ion-item *ngFor="let item of child.children" detail-none class="child-item" text-wrap no-lines>
         <ion-label>{{ item.name }} <p style="color: #0077ff;">{{ selected }}</p> </ion-label>
         <ion-checkbox item-end [(ngModel)]="value" (click)="tofix(item)"></ion-checkbox>
    </ion-item>
    .....

form.ts

    export class FormPage  implements OnInit{
      data: any[];

      public SelectedItemToFix: string = '';

      @Input('item') item: any;

      constructor(public navCtrl: NavController, 
                  public navParams: NavParams, 
                  private http: Http,
                  private toastCtrl: ToastController) {
                    let localData = this.http.get('assets/data/menus.json').map(res => res.json().items);
                      localData.subscribe(data => {
                        this.data = data;
                      });
                      this.title = navParams.get('title');
                      this.subtitle = navParams.get('subtitle');
                  }

      toggleSection(i) {
        this.data[i].open = !this.data[i].open;
      }

      toggleItem(i, j) {
        this.data[i].children[j].open = !this.data[i].children[j].open;
      }

      ngOnInit() {
      }

    value = false;
    public selected: string = '';

        async tofix(item){
          let toast = await this.toastCtrl.create({
            message: `Added item to be fix : ${item.name}`,
            duration: 2000
          }); 
          console.log(this.value);
          this.SelectedItemToFix += `${item.name}`;
          if(this.value == true){
            this.selected = "Item Selected"
          }
          else{
            this.selected = "Cancelled"
          }
          toast.present();
        }

Answer 1

Вы устанавливаете все флажки ngModel на одно и то же value.

Чтобы исправить это, вы можете использовать атрибут open на вашем объекте: this.data[i].children[j].open.

Также вы можете удалитьpublic selected: string = ''; и сделайте это в самом элементе, иначе у вас возникнет та же проблема, что и со значением.

.....
<ion-item *ngFor="let item of child.children" detail-none class="child-item" text-wrap no-lines>
     <ion-label>
          {{ item.name }} 
          <p style="color: #0077ff;">
              {{ item.open ? 'Item Selected' : 'Cancelled'}}
          </p> 
     </ion-label>
     <ion-checkbox item-end [(ngModel)]="item.open" (click)="tofix(item)"></ion-checkbox>
</ion-item>
.....