Угловая остановка и возобновление проверки HTML - PullRequest
0 голосов
/ 31 октября 2019

У меня большой стол с большим количеством ячеек. Каждая ячейка имеет отличный цвет, который может меняться в зависимости от значения некоторых методов. Кроме того, в таблице есть элементы, которые можно перетаскивать с помощью перетаскивания основного текста из ячейки в ячейку.

Это HTML-код:

<tr ngFor let-row [ngForOf]="rows" let-i="index">
  <td *ngFor="let col of cols" class="{{checkA(col,row) ? 'styleA' : checkN(col,row) ? 'styleN' : ...}} 
   pDroppable="foo" (onDrop)="drop(col,row)">
    <div pDraggable="foo *ngIf="getFoo(col, row) != null" (onDragStart)="dragStart(col,row)" (onDragEnd)="dragEnd()">
      {{foo.name}}
    </div>
  </td>
</tr>

И этот код JS:

dragStart(col, row) {
  this.select.col= col; 
  this.select.row= row;
}

dragEnd(event) {
  this.select = null;
}

drop(col, row) {
  this.move(this.select.col, this.select.row, col, row);
  this.select = null;
}

Таблица такая большая, и проверки не всегда возвращают одно и то же значение, поэтому после каждого изменения в таблице необходимо проверять все ячейки. Проблема в том, что все ячейки проверяются каждый раз, когда в js изменяется какое-то значение, например, когда происходит событие dragStart. Это не влияет на html, но все ячейки снова проверяются, и для начала перетаскивания требуется десять секунд. Есть ли способ остановить угловую проверку каждой ячейки в начале dragStart и возобновить ее позже, когда будут (или нет) некоторые изменения в таблице? Примерно так:

dragStart(col, row) {
  this.select.col= col; 
  this.select.row= row;
  this.stopChecking();
}

dragEnd() {
  this.select = null;
  this.resumeChecking();
}

drop(col, row) {
  this.move(this.select.col, this.select.row, col, row);
  this.select = null;
  this.resumeChecking();
}

Угловая версия - 7.2.15, а основная версия - 6.1.7

.
...