Как обновить переменную в Angular при перетаскивании из заданного c раскрывающегося списка с помощью CdkDragDrop?

Question

Я использую Angular 8 с перетаскиванием материала. У меня есть несколько дроплистов, связанных с тремя дроплистами назначения. В моем примере StackBlitz здесь я хотел бы разрешить только один элемент из списка с идентификатором MajHermeticVirtues (вторая группа под Major Hermeti c Virtues). У меня есть логическое значение allowHermeticVirtues, которое я хотел бы установить в false, если я перетащил элемент из этого списка. Если для переменной задано значение false, как я могу использовать ее, чтобы заблокировать больше элементов из списка источников?

Все списки используют

  drop(event: CdkDragDrop<string[]>) {
    if (event.previousContainer === event.container) {
      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
    } else {
      transferArrayItem(event.previousContainer.data,
                      event.container.data,
                      event.previousIndex,
                      event.currentIndex);
      this.calculateTotal();
    }
  }

для событий удаления.

Как мне обновить переменную, если я перетащил элемент из указанного c списка? Этот вопрос - почти то, что я ищу, но только для определенного c списка источников (в моем случае, MajHermeticVirtues).

Answer 1

Мне удалось заставить его работать, изменив мою функцию отбрасывания следующим образом (не элегантно, но, кажется, работает):

drop(event: CdkDragDrop<any[]>) {
  if (event.previousContainer === event.container) {
        moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
      } else if (event.previousContainer.id === 'MajHermeticVirtues') {
          if (this.totalMajorHermeticVirtues < this.maxHermeticMajorVirtue) {
            this.totalMajorHermeticVirtues++;
            console.log('this.totalMajorHermeticVirtues :', this.totalMajorHermeticVirtues);

            transferArrayItem(event.previousContainer.data,
                          event.container.data,
                          event.previousIndex,
                          event.currentIndex);
            this.calculateTotal();
          }
        } else if (event.container.id === 'MajHermeticVirtues') {
            this.totalMajorHermeticVirtues--;
            console.log('this.totalMajorHermeticVirtues :', this.totalMajorHermeticVirtues);

            transferArrayItem(event.previousContainer.data,
                          event.container.data,
                          event.previousIndex,
                          event.currentIndex);
            this.calculateTotal();
      } else {
        transferArrayItem(event.previousContainer.data,
          event.container.data,
          event.previousIndex,
          event.currentIndex);
        this.calculateTotal();
      }
    }