Как сделать дерево категорий в угловых 6? Так что все дети (все уровни)

Question

У меня есть дерево категорий в веб-сервисе - WCF, отсортированное по всем уровням. Каждая категория состоит из трех компонентов:

1. ID (int),
2. Имя (строка)
3. ParenID (int?)

Я хочу, чтобы это дерево также появилось на стороне Angular 6 с машинописью.

Это файл component.htm:

<div class="categories">
        <div *ngFor="let category of categories">
          <h6>{{category.Name}}-<label > წიგნების რაოდენობა {{category.BookCount}}</label> </h6>
          <ul>
            <ng-template #recursiveList let-list>
              <li *ngFor="let subCategory of list">
                <div>{{subCategory.Name}}- <label > წიგნების რაოდენობა {{subCategory.ChildBookCount}}</label></div>
                <ul *ngIf="subCategory.ChildCategory?.length > 0">

                  <ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: subCategory.ChildCategory }"></ng-container>
                </ul>
              </li>
            </ng-template>

            <ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: category.ChildCategory }"></ng-container>
          </ul>
        </div>
      </div>