Expected behavior

We currently are using the MDB angular treeview component to display some data as multiple trees within the same page/section. Some functionality that we're looking to implements is that when you click the top level of one tree, all sub-levels and their respective children will all expand at the same time, expanding to the deepest level.

Actual behavior

As we have it set up now, if you click on one tree, all of the other trees will also expand, even though they are completely separate from that one. If there a way that we can do this will only targeting one tree based on the top level item that is clicked - thus only having that tree expand, and leave the others in their default state.

Resources (screenshots, code snippets etc.)

Here is how we have the `mdb-tree` component setup in out HTML:

<mdb-tree #tree textField="Name" childrenField="children" [nodes]="testTechnicalQualifications"
                    [toggleOnTitleClick]="true" (click)="expandAllNodes($event)" [expandAll]="expanded"
                    ></mdb-tree>

Here is the TypeScript function where we expand the tree to it's the deepest level, but we get the issue where ALL trees expand, where we only want the one that was clicked to expand. Is there a way that an ID or some type of unique identifier can be added to each tree so that we know exactly which one to toggle based on the top-level item that was clicked. Or is there some other fix/workaround that you can recommend?

    expandAllNodes(event: any) {
        if (!this.expanded) {
              this.expanded = true;
        }
        else return
      }