Как сделать маршрутизацию на дочерний элемент древовидной таблицы?

Question

При нажатии на последний элемент древовидной таблицы я хочу направить его на другой экран (URL) и показать таблицу.

Например:

Я хочу выбрать последний узел родительского узла каждого элемента в таблице дерева.

При щелчке дочернего узла он должен перейти на новый экран.

Выглядит так:

>Aamir
 >Ranchi
    > 12
    > 20
 > Bangalore
    > 22
>Abhinav
 > Bangalore
   >26

Поэтому, когда пользователь выбирает 12, 20,22 или же 26, следует перейти на новый экран.

Шаблон:

<h3>Dynamic Columns</h3>
<p-treeTable [value]="files2" [columns]="cols" >
    <ng-template pTemplate="header" let-columns>
        <tr [ttRow]="rowNode">
            <th *ngFor="let col of columns">
                {{col.header}}
            </th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
        <tr >
            <td *ngFor="let col of columns; let i = index">
                <p-treeTableToggler [rowNode]="rowNode" *ngIf="i == 0"></p-treeTableToggler>
                {{rowData[col.field]}}
            </td>
        </tr>
    </ng-template>
</p-treeTable>

Answer 1

Я думаю, что важная вещь, о которой вы не упомянули, это то, что это primeng-treetable.

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

<a href="/" *ngIf="!rowNode.node.children">{{rowData.name}}</a>
<span *ngIf="rowNode.node.children">{{rowData.name}}</span>

Вы можете проверить работоспособность stackblitz здесь: https://stackblitz.com/edit/test-primeng-7cqjzl