Angular:用于显示树的递归组件

时间:2018-09-01 12:10:27

标签: angular

我有代表树形结构的JSON数据(app.component.ts中的data:string)。

现在,我想在表中显示数据。为此,我建立了foo.component.ts。 它打印一个节点,然后回想地继续操作。

一切正常。

是这里: https://stackblitz.com/edit/angular-bqfh7h

但是接下来,我想单击一个节点并标记该节点的每个子节点。标记应更改示例中的字体粗细。

那是行不通的,我不确定为什么。我将标记动作放在中,因为我认为其中包括每个子注释。

不知道我做错了还是递归组件无法做到。

有什么想法可以使它起作用吗?

1 个答案:

答案 0 :(得分:1)

好的,我对组件的结构做了些微的改动。

每个foo实例现在负责显示其名称(即farm),并且循环已移动,因此现在循环遍历了其子代。这样,有很多孩子的单亲父母。

我还为@Input添加了selected,这使我们可以使用绑定来选择子项。

Here is the working StackBlitz