`
LiYunpeng
  • 浏览: 948490 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

基于angular的tree控件

阅读更多
以前用过一些基于Angular的树形控件,但是发现都多少有些别扭,就是写起来会有些不爽,最近就在纠结是不是要重写一个,最后终于决定重写,开始写就收不住了,发现用起来爽多了,就将项目开源了出来。


目前实现的功能有
节点展开、关闭;
同级节点新增;
子集节点新增;
删除节点;
选中节点;

可配置
是否互斥;
数据源子集的属性名称;
是否只有叶子节点才可选中;

可访问
节点内可通过node来进行访问传入的数据
是否关闭状态,
是否选中状态,
是否在自己的子集包含选中节点,
当前节点的层级数;

还可以将节点的子集放在自己想放的位置



http://pop-lee.github.io/z-angular-tree/
分享到:
评论

相关推荐

    前端项目-angular-tree-control.zip

    在实际使用中,首先需要将`angular-tree-control`库引入到项目中,然后在AngularJS模块中声明依赖,并在需要使用树形控件的视图中注入相应的指令。接着,通过控制器来处理数据模型和树形结构的交互逻辑。最后,通过...

    AngularJS的tree控件

    AngularJS的Tree控件是一种在Web应用中展示层次结构数据的有效方式。AngularJS,作为一款强大的前端JavaScript框架,提供了一种灵活的方式来构建动态、数据驱动的用户界面。在这个主题中,我们将深入探讨如何使用...

    数据绑定到tree控件上。

    在这个场景中,我们讨论的是将数据库中的数据绑定到tree控件上,这是一种常见的需求,特别是在构建具有层次结构的界面时,如文件系统、组织架构或菜单结构。Tree控件因其能够清晰地展示层级关系而被广泛使用。 数据...

    angularjs下拉树控件

    在"angular-tree-master"这个项目中,可能包含了实现上述功能的源代码,包括指令、模板、控制器、样式和示例数据。通过查看和学习这些文件,你可以更好地理解如何在实际项目中集成和定制下拉树控件。 总结一下,...

    angular2的树型结果展示组件

    - **Angular2**:这个组件是基于Angular2框架构建的,利用了Angular的依赖注入、指令系统和组件化特性。 - **双向数据绑定**:Angular2的双向数据绑定使得组件状态和视图之间的同步变得简单。 - **服务(Service...

    js很好用的常用树形控件

    而如果项目基于AngularJS或Bootstrap,Angular UI Tree 和 Bootstrap Tree View则更合适。使用这些控件时,需要注意兼容性问题,确保在不同的浏览器和设备上都能正常工作,并且要关注性能优化,特别是处理大量数据时...

    angular-easyui

    6. **树形控件(tree)**:展示层次结构的数据,支持展开/折叠节点。 7. **下拉选择器(combobox)**:组合输入框和下拉列表,方便用户从预定义的选项中选择。 ### 主题与定制 Angular EasyUI 提供了多种主题,...

    多选的树控件

    在前端,可以使用JavaScript库如jQuery、React、Vue或Angular等,它们都有对应的组件来支持创建多选树控件。例如,React中可以使用rc-tree或者ant-design的Tree组件,这些组件通常提供了丰富的API和回调函数,如...

    CheckBoxTree

    4. **事件处理**:CheckBoxTree控件需要监听用户的交互事件,如点击复选框、展开或折叠节点等。事件触发后,需要执行相应的处理函数,比如更新选中状态、刷新视图、调用回调函数等。 5. **可扩展性**:为了适应不同...

    在 Angular 中实现搜索关键字高亮示例

    在 Angular 中,我们不应该试图直接修改 DOM 的内容,当需要更新 DOM 内容的时候,应该修改的其实是我们的数据模型,也就是 $scope 中的数据,Angular 会帮助我们将修改之后的数据展示在页面中。 但是,在有些情况下...

    几个经典JavaScript控件

    以下是一些基于JavaScript的经典控件及其相关的知识点: 1. **表格操作**: - `javascript 表格操作.html` 和 `操控表格.txt` 提示了如何使用JavaScript来操作HTML表格。JavaScript可以用于创建、修改、删除表格行...

    树形控件js

    - **第三方库**:像JSTree、zTree等专门的树形控件库,提供了丰富的功能和良好的API,方便开发者快速集成。 5. **文件名"树形菜单"的含义** 这可能是一个示例文件或者库,专门用于实现树形菜单,可能包含HTML模板...

    tree+grid 实现treeview 的表格显示

    4. **JavaScript库**:有许多JavaScript库,如jQuery、React、Angular等,提供了实现Tree+Grid的功能。例如,jQuery的jstree插件可以创建交互式的树,而Bootstrap的Table和Tree插件也可以组合使用。在前端框架中,如...

    javascript 树形控件

    8. **模块化与框架兼容**:如果控件是作为库或组件发布,那么它需要遵循模块化标准(如CommonJS、ES6模块),并且尽可能兼容流行的前端框架(如React、Vue、Angular等)。 9. **无障碍性**:为了满足无障碍性需求,...

    时间控件页面

    当今流行的前端框架如Bootstrap、Angular和React都提供了时间控件组件,简化了开发过程: - **Bootstrap**:其时间插件如datetimepicker,通过简单的HTML和CSS就能实现美观的日期时间选择器。 - **Angular ...

    javascript树形结构控件

    - 市面上有许多成熟的JavaScript库,如jQuery UI、Angular UI Tree、jstree等,它们提供了现成的树形控件,开发者可以通过配置和扩展来满足特定需求。 9. **响应式设计**: - 考虑到不同设备的显示差异,树形结构...

    JavaScript 树型控件源码

    - **框架集成**:如React、Vue或Angular等现代前端框架中,可以利用组件化思想构建树型控件。 4. **核心功能**: - **节点操作**:包括添加、删除、移动节点,以及展开、折叠节点。 - **搜索与筛选**:提供搜索...

    各种样式的js实现的treeMenu

    - **Angular Tree Component**:对于Angular应用,有专门的树组件库,如ng-tree-antd或angular-tree-component。 - **React Treeview**:React社区也有许多优秀的树形组件,如react-treebeard和react-dnd-treeview...

    DTree控件介绍_原创

    DTree控件可以应用于多种编程环境,如JavaScript(例如jQuery UI的Treeview,Dojo的Tree等)、Java(Swing的JTree,JavaFX的TreeView)、C#(Windows Forms的TreeView,WPF的TreeView)等,还有各种Web框架中的实现...

    chekboxtree

    5. **可定制化**:优秀的CheckboxTree控件应该提供高度的定制性,包括但不限于节点样式、图标、选中状态的颜色、多选模式(独立选择或全选/全不选)、是否显示复选框等。 6. **性能优化**:对于大数据量的树结构,...

Global site tag (gtag.js) - Google Analytics