如何使“清晰树视图”中的树节点文本可单击？

Question

我使用Clarity Framework（clr-tree元素）生成了以下树结构。

这是我编写的用于在视图中生成代码的代码：

<clr-tree>
  <clr-tree-node
    *clrRecursiveFor="let item of list; getChildren: getChildren"
    (click)="onSelect(item)"
    [class.m-selected]="selected && item.slug === selected.slug"
    > {{item.title}}
  </clr-tree-node>
</clr-tree>

它工作正常，但问题是我只能通过单击图标来展开文件夹。单击文件夹的标题文本不会展开子级。是否可以使用Clarity框架实现这种行为？

Answer 1

您可以使用clrExpanded绑定到展开状态，并绑定属性以确定节点是否应该展开。然后，您可以使用点击处理程序以编程方式切换该状态。

<clr-tree>
  <clr-tree-node
    *clrRecursiveFor="let item of list; getChildren: getChildren"
    (click)="onSelect(item) && item.expanded = !item.expanded"
    [(clrExpanded)]="item.expanded"
    [class.m-selected]="selected && item.slug === selected.slug"
    > {{item.title}}
  </clr-tree-node>
</clr-tree>