Как сделать счетчик, который не учитывается, когда я перетаскиваю элемент на пустое место в той же сетке (сбоку) - PullRequest
Новая
       7

Как сделать счетчик, который не учитывается, когда я перетаскиваю элемент на пустое место в той же сетке (сбоку)

0 голосов
/ 17 июня 2020

У меня проблема. Я разделил экран на две части. Одна половина имеет изображения по сетке, а другая половина пуста. Я перетаскиваю их друг от друга.

Какие условия я должен установить, чтобы убедиться, что никакая часть моя сетка пуста? 

 drop(ev, index) {
    ev.preventDefault();
    const data = ev.dataTransfer.getData('text');
    ev.dataTransfer.setData('text', ev.target.id);
    if ( ev.target.id === 'emptySide1') {
      ev.target.appendChild(document.getElementById(data));
      this.cnt--;
    } else if ( ev.target.id === 'emptySide2') {
      ev.target.appendChild(document.getElementById(data));
      this.item[index] = this.img[this.index];
      this.cnt++;
    }
       this.btnContent = (this.cnt === this.img.length) ? 'continue : fill the empty place';


  }

<div class="wrapper">


  <div class="wrapper2">



    <div class="box" id="emptySide1" *ngFor="let image of img let i = index" (drop)="drop($event,i)"
    (dragover)="allowDrop($event)">
      <img  [src]="image.name" width="100%" height="150" draggable="true" (dragstart)="drag($event, i)" [id]="image.id" >
    </div>

  </div>
  <div class="border-left"></div>

  <div id="mycanvas" class="wrapper3">
    <div class="box2" id="emptySide2" *ngFor="let image of img let i = index" (drop)="drop($event,i)"
    (dragover)="allowDrop($event)">



    </div>

  </div>

</div>

<button class="btn" (click)="loopitem()" [disabled]="cnt !== img.length">{{this.btnContent}}</button>
...