AngularDart Material Design 选项树 顶

MaterialTreeComponent

Selector: <material-tree>

支持选项树的材质选择组件。

要使用,只需传递最少的选项即可查看项目。

如果SelectionOptions实现Parent接口,则为Parent.hasChildren设置的每个选项显示一个handle,并且切换handle将从Parent.childrenOf的结果创建另一个树。

如果SelectionOptions实现Filterable接口。

要从组件接收反馈,需要selection模型。

要自定义,请指定itemRenderer和/或factoryRenderer。

Inputs:

  • allowParentSingleSelection bool  小部件是否支持选择非叶节点 如果为false,并且小部件使用单个选择模型,则单击小部件时应在单击非叶节点时切换扩展。 如果为true,则小部件应在单击时选择非叶节点,并且仅在单击扩展图标时切换扩展。
  • componentRenderer (dynamic) → Type 已禁用!请改用[factoryRenderer]
  • expandAll bool  是否始终扩展选项组。
  • factoryRenderer (dynamic) → ComponentFactory<dynamic>  指定用于确定用于呈现项目的工厂的factoryRenderer。
  • itemRenderer (dynamic) → String  一个简单的函数,用于将项呈现为字符串。
  • optimizeForDropdown bool  是否在单个选择下拉列表中隐藏复选标记
  • options SelectionOptions<dynamic>  这个contianer的可用选项。
  • selection SelectionModel<dynamic>  此容器表示的选择模型。

MaterialTreeDropdownComponent

Selector: <material-tree-dropdown>

包含MaterialTreeComponent的按钮触发下拉列表。

Inputs:

  • componentRenderer (dynamic) → Type  已禁用!请改用[factoryRenderer]
  • expandAll bool  是否始终扩展选项组。
  • factoryRenderer (dynamic) → ComponentFactory<dynamic>  指定用于确定用于呈现项目的工厂的factoryRenderer。
  • itemRenderer (dynamic) → String  一个简单的函数,用于将项呈现为字符串。
  • options SelectionOptions<dynamic>  这个contianer的可用选项。
  • placeholder String  当没有选择任何内容时,占位符将用于下拉文本。
  • selection SelectionModel<dynamic> 此容器表示的选择模型。
  • shouldExpandAllWhenFiltered bool  如果为true,则在过滤树时展开所有项目。
  • showFilterInsidePopup bool  将过滤器输入放在弹出窗口内。
  • visible bool  是否显示下拉列表。

Outputs:

  • visibleChange Stream<bool> 当下拉列表的可见性发生变化时触发。

MaterialTreeFlatReadonlyDemoComponent

MaterialTreeFlatSelectableDemoComponent

MaterialTreeFlatMultiDemoComponent

MaterialTreeNestedSingleDemoComponent

MaterialTreeNestedSingleParentSelectableDemoComponent

MaterialTreeNestedMultiDemoComponent

MaterialTreeNestedItemRenderingComponent

MaterialTreeNestedComponentRenderingComponent

MaterialTreeNestedExpandDemoComponent

MaterialTreeDropdownSingleDemoComponent

MaterialTreeDropdownMultiDemoComponent

MaterialTreeDropdownFilterableDemoComponent

MaterialTreeDropdownNestedFilterableDemoComponent

MaterialTreeDropdownNestedFilterInPopupDemoComponent

MaterialTreeNestedSingleDividerDemoComponent

MaterialTreeViewMoreDemoComponent

查看示例,查看源码

(adsbygoogle = window.adsbygoogle || []).push({}); function googleAdJSAtOnload() { var element = document.createElement("script"); element.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"; element.async = true; document.body.appendChild(element); } if (window.addEventListener) { window.addEventListener("load", googleAdJSAtOnload, false); } else if (window.attachEvent) { window.attachEvent("onload", googleAdJSAtOnload); } else { window.onload = googleAdJSAtOnload; }

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Golang语言社区

配置文件热加载的go语言实现

通常我们更新应用程序的配置文件,都需要手动重启程序或手动重新加载配置。假设一组服务部署在10台机器上,你需要借助批量运维工具执行重启命令,而且10台同时重启可能...

99850
来自专栏ionic3+

【Appetite】ionic3实录(七)次页实现及分析解决问题【下】

一般一些js插件,是依托dom的。我们观察initSwiper方法,第一个参数'.wheel .swiper-container'其实是个选择器,所以它也是依托...

8820
来自专栏小狼的世界

Apache环境下页面乱码的几种可能总结

采用典型的LAMP架构开发的时候,环境中多处涉及到编码的指定,有一个地方忽略,都有可能造成页面汉字乱码的产生,本文将总结这些乱码产生的可能的原因,方便我们排查。

11210
来自专栏C语言及其他语言

C语言逆向系列之破解一个简单的C语言程序

以下正文 本节教程将教大家如何去逆向分析和破解一个简单的C程序,需要大家熟悉基本的C语言语法,用到工具有:VC6、IDAPro、OD、UE等工具。 下面我们开...

51450
来自专栏张戈的专栏

利用腾讯云 COS 云对象存储定时远程备份网站

一、优点分析 内网传输:和阿里云 OSS 一样,腾讯云 COS 同样支持内网和外网文件传输,对于腾讯云服务器,使用内网传输绝对是最快、最稳定的备份方案! 免费...

2.9K100
来自专栏为数不多的Android技巧

Android Studio你不知道的快捷键(三)

有没有这样的场景:你在Android Studio打开了一个图片文件(或者别的文件),想在资源浏览器里面查看这图片;在Eclipse里面我想大部分的人是Alt ...

14010
来自专栏陈树义

Wins批处理基本语法

在Windows平台下,批处理可以和Wins系统很好地结合,处理一些简单的任务,比如:重复删除某种类型的文件;开机执行一些特定的命令等。 本文主要介绍批处理的基...

380100
来自专栏BinarySec

CVE-2010-2553分析[漏洞战争]

CVE 2010-2553漏洞,也称为MicrosoftWindows Cinepak 编码解码器解压缩漏洞,影响的操作系统版本有:Microsoft Wind...

45360
来自专栏王二麻子IT技术交流园地

八、VueJs 填坑日记之参数传递及内容页面的开发

我们在上一篇博文中,渲染出来了一个列表,并在列表中使用了router-link标签,标签内的:to就是链接地址,昨天咱们是<router-link :to="'...

24070
来自专栏hbbliyong

openFileDialog的Filter属性设置

OpenFileDialog对话框的Filter属性说明:          首先说明一个示例,分析一下Filter属性的构成:“ Excel文件|*.xls ...

29170

扫码关注云+社区

领取腾讯云代金券