Выбор опции mat в select-mat удаляет стиль из другого элемента HTML

Question

У меня есть мат-дерево, и к его «root элементу» (кнопка, по которой вы щелкаете, чтобы развернуть дерево) у меня был цвет фона (с event.target.style.backgroundColor) при нажатии, и удалите его при повторном нажатии, определив, есть ли у элемента уже цвет (if (event.target.style.backgroundColor === "lightgray") ...).

В другой части компонента у меня есть таблица mat, которая содержит элементы выбора mat, и выбор их параметров не вызывает никаких проблем. Но у меня есть один конкретный выбор циновки, расположенный за пределами таблицы, который при щелчке удаляет мой фоновый цвет, несмотря на то, что я не вызываю функцию, ответственную за него ... Это проблема для меня, так как это определение цвета фона также помогает меня за другие действия.

  <mat-tree [dataSource]="dataSource" [treeControl]="treeControl" class="example-tree" #tableTree>

            <mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle>
                <li class="mat-tree-node">
                    <button id={{node.GUID}} mat-button style="cursor: pointer"  (click)="treeNodesClassAdd(node.GUID); createdDisplayedColumns(node.GUID); retrieveSelectedTableData(node.GUID)">
                        {{node.name}}
                    </button>
                </li>
            </mat-tree-node>

            <mat-nested-tree-node *matTreeNodeDef="let node; when: hasChild">
            <li>
                <div style="text-align: middle" class="special-div"  id="divId" (click)="listClassAdd_deselectTreeNodes($event,6)  " matRipple matTreeNodeToggle>
                    {{node.name}}
                </div>
                <ul [class.example-tree-invisible]="!treeControl.isExpanded(node)">
                    <ng-container matTreeNodeOutlet></ng-container>
                </ul>
            </li>
            </mat-nested-tree-node>
        </mat-tree>

Мат-дерево находится внутри мат-карты

<div class="listsContainer" *ngIf="otherVariables.chosenOption != 6 && otherVariables.chosenOption != undefined" >
    <mat-list role="list" *ngFor="let element of lists[otherVariables.chosenOption]; let i=index">
        <div class="selectionItems">
            <mat-list-item role="listitem" (dblclick)="goToModification(i)">{{element.name}}</mat-list-item>
        </div>
    </mat-list>
</div>

Проблемный c выбор матов находится вне карты, сам по себе.

Я попытался положить мат-карту и мат. дерево в DIV, но это не помогает.

Не стесняйтесь сказать мне, если может быть полезно увидеть какую-либо другую часть кода.