Изменение стиля в дочерних компонентах Angular Material Tree

Мне нужно поменять цвет дочерних элементов дерева. Я получаю данные этих элементов:

но я никак не могу понять как мне используя эти данные изменить через ngClass мой css для этих элементов

Вот как я получаю данные выше

html

<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
    <mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding>
        <button mat-icon-button disabled></button>        
        <div [ngClass]="nodeChecked">
            <mat-icon fontSet="material-icons-outlined" class="mat-icon-rtl-mirror">
                {{'table_chart_outline'}}
            </mat-icon>
            <span> {{node.name}}</span>
        </div>
    </mat-tree-node>
    <!-- list item with childs -->
    <mat-tree-node *matTreeNodeDef="let node; when: hasChild" matTreeNodePadding>
        <button mat-icon-button matTreeNodeToggle [attr.aria-label]="'toggle ' + node.name">
            <mat-icon class="mat-icon-rtl-mirror">
                {{treeControl.isExpanded(node) ? 'remove' : 'add'}}
            </mat-icon>
        </button>
        <div class="node-name">
           
        <mat-checkbox 
            [checked]="isCheckedNode(node)"
            [indeterminate]="isParentForCheckedNode(node)"
            (change)="foodItemSelectionToggle(node)">
            <mat-icon class="mat-icon-rtl-mirror">
                {{'folder'}}
            </mat-icon>
            <span>{{node.name}}</span>
        </mat-checkbox>     
           
    </div>
    </mat-tree-node>
</mat-tree>
<div>
    Selected node: <span><strong *ngIf="!selectedNode">None!</strong><strong *ngIf="selectedNode">{{selectedNode.name}}</strong></span>
    <div>
        Path to Selected node: <strong *ngIf="!getPathsToSelectedNode">None!</strong>
        <ul *ngIf="getPathsToSelectedNode">
            <li *ngFor="let item of getPathsToSelectedNode">{{item.level}} - {{item.name}}</li>
        </ul>        
    </div>
    
</div>