ng2tree-common 是一个专门为 Angular2+ 开发定制的树形控件，在前端开发的过程中被广泛使用。本文将对 ng2tree-common 的使用进行详细介绍，包括如何安装、如何使用以及如何实现树形结构的展示。
安装
ng2tree-common 的安装非常简单，只需要在命令行中输入以下命令即可：
npm install ng2tree-common --save
安装完成后，需要在 app.module.ts 中引入 ng2tree-common：
-- -------------------- ---- -------
------ ------------ ---- -----------------
-----------
-------- -
-------------------- -- ---------
--
------------- -
-------------
--
---------- ---------------
---------- --
--
------ ----- --------- - -使用
ng2tree-common 提供了丰富的 API ，使用时只需要根据自己的需求进行调用即可。下面是一个简单的示例：
-- -------------------- ---- -------
------ ----- ------------ -
------- ------ ---------- - ---
------------- -
-----------------
-
----------- -
--- ---- - --- ---------- ----- ------ ---
--- ------ - --- ---------- ----- -------- ---
--- ------ - --- ---------- ----- -------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
------------------------------
------------------------------
------------------------------
------------------------------
----------------------
----------------------
----------------------
-
-这里我们创建了一个节点树，并将其存储在 AppComponent 中的 nodes 属性中。随后我们可以在视图中使用以下代码来展示该节点树：
<tree [nodes]="nodes"></tree>
完整示例代码如下：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - -------- - ---- -----------------
------------
--------- -----------
--------- ------ ------------------------
--
------ ----- ------------ -
------- ------ ---------- - ---
------------- -
-----------------
-
----------- -
--- ---- - --- ---------- ----- ------ ---
--- ------ - --- ---------- ----- -------- ---
--- ------ - --- ---------- ----- -------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
--- ------------ - --- ---------- ----- -------------- ---
------------------------------
------------------------------
------------------------------
------------------------------
----------------------
----------------------
----------------------
-
-深入学习
除了基本的使用外，ng2tree-common 还提供了许多高级特性，人们可以通过官方文档进行深入学习。
指导意义
ng2tree-common 的使用可以大大节省开发人员的时间和精力，并且它已经被广泛应用于各种 Web 开发场景中。如果您对于树形控件的展示及其交互方式感兴趣，不妨尝试一下它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668f1d9381d61a3540dad