Я слежу за этим документом, чтобы использовать угловой компонент вида дерева кендо для отображения иерархических данных. https://www.telerik.com/kendo-angular-ui/components/treeview/expand-state/
Мое требование заключается в том, что я хочу развернуть все узлы древовидного представления под нагрузкой
В документации Kendo говорится о двух способах сделать это. Либо на основе иерархического индекса, либо на основе имени элемента https://www.telerik.com/kendo-angular-ui/components/treeview/expand-state/#toc-built-in-directives. Дерево в моем случае имеет много уровней и много дочерних элементов на уровне. Следовательно, я не могу перечислить все свои предметы как расширенные ключи.
Мой код такой. Но это расширяет только один элемент, который в данном случае является корнем.
import { Component } from '@angular/core';
import { of } from 'rxjs';
@Component({
selector: 'my-app',
template: `
<div class="example-config">
Expanded keys: {{expandedKeys.join(",")}}
</div>
<kendo-treeview
[nodes]="data"
textField="text"
[hasChildren]="hasChildren"
[children]="fetchChildren"
kendoTreeViewExpandable
[expandBy]="'text'"
[(expandedKeys)]="expandedKeys"
>
</kendo-treeview>
`
})
export class AppComponent {
public expandedKeys: any[] = ['Furniture'];
public data: any[] = [
{
text: 'Furniture', items: [
{ text: 'Tables & Chairs' },
{ text: 'Sofas' },
{ text: 'Occasional Furniture' }
]
},
{
text: 'Decor', items: [
{ text: 'Bed Linen' },
{ text: 'Curtains & Blinds' },
{ text: 'Carpets' }
]
}
];
public hasChildren = (item: any) => item.items && item.items.length > 0;
public fetchChildren = (item: any) => of(item.items);
}
Я видел решения для типовой проблемы в jquery, упомянутом здесь. https://www.telerik.com/forums/how-do-you-default-a-treeview-to-expanded-on-initialization Может ли кто-нибудь помочь с решением задачи для угловых?