我在侧面导航中显示嵌套的json文件时遇到问题

Question

我在将嵌套的json显示到mat-side-nav时遇到问题

我的json文件部门：

{departmentID: 15;                             
 departmentName: Site;
 listOfDepartment: Department []}

所以我有5个子级别，与全球部门相同

我的问题：我只能显示此树的2级，不能显示更多

我将非常感谢您的帮助... 我下面的HTML代码

<mat-sidenav #drawer class="sidenav" fixedInViewport [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'" [mode]="(isHandset$ | async) ? 'over' : 'side'" [opened]="(isHandset$ | async) === false">

    <mat-toolbar *ngIf="department!==undefined" color="accent">{{department.departmentName}}</mat-toolbar>
    <mat-checkbox [checked]="checkbox" (change)="onLoadTree($event)">Active1 </mat-checkbox>        
        <ng-template #recursiveList let-department>
            <mat-nav-list *ngFor="let dep of department.listOfDepartments" (click)="toggleMenu(dep.departmentId)" routerLink="/list" routerLinkActive="active">
                <a mat-list-item *ngIf="dep" routerLink="/list" routerLinkActive="active">
                    {{dep.departmentName}}
                    <mat-icon *ngIf="!showMenu(dep.departmentId)">chevron_right</mat-icon>
                    <mat-icon *ngIf="showMenu(dep.departmentId)">expand_more</mat-icon>
                </a>
                <div *ngIf="dep.listOfDepartments.length">                     
                    <mat-nav-list *ngIf="showMenu(dep.departmentId)" class="submenu">
                        <a ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: dep}"> 
                    </a>
                    </mat-nav-list>
                </div>
            </mat-nav-list>
        </ng-template>
        <ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: department}"></ng-container>
    </div>

</mat-sidenav>