问题标签 [angular-tree-component]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
3520 浏览

treeview - 如何使用 Angular Tree 组件以编程方式将子节点添加到父节点的子节点

我在使用角度树组件时遇到问题。我相信这个问题很简单,但我可以完全理解它。我似乎无法将子节点添加到父节点的子节点。那是根节点的孙子节点等等。我想添加曾孙等,但我仍在努力添加孙子。如果有人在lidorsystems 上看到integralUiTreeview。然后你就可以理解了。这是示例的链接https://www.lidorsystems.com/support/articles/angular/treeview/treeview-add-items-dynamically/ 我正在尝试做的事情。环顾整个互联网,我了解到这并不是很容易做到,但我正在使用角度树组件,我只想知道如何通过单击按钮来添加孩子。我已成功将子节点添加到根节点,但仅添加到第一个根节点。我想知道的是如何将孩子添加到我想要的任何节点,以及如何删除它。我相信我可以自己处理编辑部分。如果lidorsystems 是免费的,我会使用它。我怎样才能做到这一点?

这是我用来添加根节点的代码

而这是第一个根的子节点。虽然这都是常规的:

这是html:

0 投票
1 回答
104 浏览

angular - 自定义数据结构为表

我有一个关于树组件的问题。是否可以让我的树组件像一张桌子?这是我真正想要的:

在此处输入图像描述

以下是文档示例中的一些片段:

0 投票
1 回答
1995 浏览

angular - 带有复选框的角材料树 - 获得检查和不确定的值

我从这个例子中得到了几乎 1 比 1 的树:https ://stackblitz.com/angular/nnxeaxmrdob?file=src%2Fapp%2Ftree-checklist-example.ts

我需要的是获取所有选定的值和不确定的值。我知道,所有选定的值均在清单选择变量中持有,但是问题是选择了整个子节点时,我有一系列的父母和孩子,但是只选择了一些孩子,那么我没有父母。

所以再一次,我如何获得选择和不确定的值?

0 投票
1 回答
257 浏览

angularjs - AngularJS UI-Grid Tree View:子行如何具有与父行不同的列名?

我正在尝试为子行设置与 UI-Grid 中 TreeView 中的父行不同的列和列名 在此处输入图像描述

已经有问题提出,但评论部分提供的链接已过期。 Angular UI-Grid Tree View - 更改子树级别的列标题

0 投票
1 回答
1118 浏览

angular - 加载数据后角树组件展开

我想在启动时展开第一个节点。我在这里看到了要走的路。不同之处在于我的代码中没有节点,而是从我的数据库中获取它。这是我的代码:

那行不通。第一个控制台日志显示这treeModel是一个对象,但第二个是未定义的。我可以从第一个输出中获得所有节点的nodes属性,treeModel但我无法访问它们。

如何在启动时扩展第一个节点?

0 投票
2 回答
1492 浏览

json - 如何将 HttpClient GET 获取的数据存储到变量中?

我的后端localhost:3000/gettreeview返回一个 JSON 对象,它需要存储在变量中nodes。我试图用下面的代码来完成它,但失败了:

我收到以下错误消息:

更新 我的 template.html:

0 投票
1 回答
1126 浏览

json - 如何实现这个角树组件异步数据代码?

我在实现这个https://angular2-tree.readme.io/docs/async-data-1时遇到了麻烦。如何将 OnInit 中的以下代码重写为文档中的异步代码?:

另请参考这个问题How to store HttpClient GET fetched data into a variable?

0 投票
0 回答
84 浏览

angular - 两个根节点如何共享公共子节点?

我们目前正在探索角度树视图组件

我们需要实现以下场景。

在此处输入图像描述

在拖放时,第 4 层和第 1 层将共享公共子级,我们可以合并子级,但从 UI 角度来看,我们需要更改 tree-node-expander 应该如上图所示。

角度树视图组件可以吗?

0 投票
1 回答
259 浏览

angular - angular-tree-component 的“treeNodeFullTemplate”的使用不清楚

我正在尝试在我的应用程序中使用以完全自定义组件,但在复制此处#treeNodeFullTemplate描述的新模板后,我似乎无法查看我的数据。

我的数据没有该name属性,所以我想使用另一个属性显示每个节点的标签,但我失败了。

我尝试将这个新模板与之前的模板(#treeNodeTemplate#loadingTemplate)结合起来,但似乎没有任何效果,并且现在阅读文档并没有真正帮助我。

如何告诉组件查找属性otherName而不是name

我在stackblitz上做了一个例子。

0 投票
1 回答
913 浏览

angular - 按需创建树视图

在我的家庭项目中,我尝试在树层次结构中显示数据。我向 API 发送 get 调用,我收到了这个 json:

我想在下面显示类似树的东西:

在此处输入图像描述

然后,当我单击例如 Adam 时,我需要发送 id 为 22 的 api 请求,因为"coWorkerId": 22 可能还有更多 coWorkerIds:例如:

在此处输入图像描述

我想按需将这些数据加载到树层次结构中。我认为每次点击都应该产生 api 调用。当然,Everey 的另一个调用可能不是 las,因为我的节点可以拥有更多的子节点。

所以在html中我尝试了:

数据服务.ts

组件.ts

我得到了列表而不是层次结构

当我点击 Adam 时,整个列表变为:

而不是创建层次结构。我正在考虑使用import {MatTreeModule} from '@angular/material/tree';. 任何想法如何完成这棵树?