我需要使用“ angulartree--component”库做一个下拉两级列表:“ ^ 4.1.0” library link。 目前,我有一个添加新项目时填充的项目列表。列表中的每个元素都应为下拉列表。
如何制作此列表结构?
export class Items extends BaseModelVersion {
name: string;
detailItems: Array<DetailItems>;
}
export class DetailItems extends BaseModelVersion {
address: string;
description: string;
}
export class ItemsComponent {
currentItem: Items;
items: Array<Items>;
nodes = [
{
name: this.currentItems,
children: this.currentItems.detailItems
}
];
options = {
childrenField: 'nodes',
getChildren: (node: TreeNode) => {
return node.data.detailItems;
},
isExpandedField: 'expended',
nodeHeight: 56,
allowDrag: false,
allowDrop: false,
useVirtualScroll: false };
constructor(public itemsFacade: ItemsFacade) {}
ngOnInit() { this.items = this.itemsFacade.getItems();}
<md-list>
<tree-root [nodes]="nodes" [options]="options">
<ng-template #treeNodeTemplate let-node let-index>
<md-list-item md-line>
<span>{{node.data.name}}</span>
<tree-node-expander [node]="node"></tree-node-expander>
</md-list-item>
<tree-root-children>
<md-list-item>
<span>{{node.data.address}}</span>
</md-list-item>
</tree-root-children>
</ng-template>
</tree-root>
</md-list>