文档章节

AngularDart Material Design 选项树

scooplol
 scooplol
发布于 2018/09/12 10:54
字数 571
阅读 14
收藏 0

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

查看示例,查看源码

© 著作权归作者所有

共有 人打赏支持
scooplol
粉丝 15
博文 103
码字总数 205785
作品 0
南充
程序员
私信 提问
AngularDart 现已全面采用 Dart 开发

一直以来,Angular 2依然采用TypeScript作为主流开发语言,然后自动编译成JavaScript 和 Dart。Dart开发者一直在进行Angular 2拆分,将其分为TypeScript/JavaScript版本和Dart版本,并成立了...

oschina
2016/07/21
6K
25
AngularDart 3.0:轻松升级,性能更好

AngularDart 3.0 现已推出。它带来更好的性能和更少的代码生成,加速开发效率。 3.0 版本尽管有一些突破性的变化,但由于 public API 的调整极少,可以看成是一个平滑的升级。主要改进在于代...

王练
2017/05/06
2.6K
4
AngularDart Material Design 卡片

自述 Material Card 材料卡是由Google材料团队(也称为mdc-web)提供的卡片样式。 这是一个允许在AngularDart应用程序中使用样式的包装器。 有关如何使用这些样式的文档,请参阅mdc文档。 可...

scooplol
2018/09/09
0
0
谷歌的 “Dart ”编程语言重返舞台

谷歌 Dart 曾经踌踌满志地想要取代 JavaScript 成为 Web 开发的首选语言。然而在一年半前,谷歌放弃了这个想法。因为 Dart 不仅仅在语言本身,包括它的整个生态圈,都比 JavaScript 落后了一...

局长
2016/11/13
5.5K
10
AngularDart Material Design 选择

MaterialSelectComponent Selector: <material-select> 材料选择是用于从集合中选择项目的容器,使用复选图标标记所选选项。 可以手动(在模板中)或通过SelectionOptions实例指定选项。 可以...

scooplol
2018/09/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

SpringBoot引入第三方jar包或本地jar包的处理方式

在开发过程中有时会用到maven仓库里没有的jar包或者本地的jar包,这时没办法通过pom直接引入,那么该怎么解决呢 一般有两种方法 - 第一种是将本地jar包安装在本地maven库 - 第二种是将本地j...

独钓渔
今天
2
0
五、MyBatis缓存

一、MyBatis缓存介绍 缓存的使用可以明显的加快访问数据速度,提升程序处理性能,生活和工作中,使用缓存的地方很多。在开发过程中,从前端-->后端-->数据库等都涉及到缓存。MyBatis作为数据...

yangjianzhou
今天
2
0
最近研究如何加速UI界面开发,有点感觉了

最近在开发JFinal学院的JBolt开发平台,后端没啥说的,做各种极简使用的封装,开发者上手直接使用。 JBolt开发平台包含常用的用户、角色、权限、字典、全局配置、缓存、增删改查完整模块、电...

山东-小木
今天
3
0
《月亮与六便士》的读后感作文3000字

《月亮与六便士》的读后感作文3000字: 看完英国作家威廉.萨默塞特.毛姆所著《月亮与六便士》(李继宏译),第一疑问就是全书即没提到“月亮”,也没提到“六便士”。那这书名又与内容有什么...

原创小博客
昨天
2
0
微信网页授权获取用户信息(ThinkPHP5)+ 微信发送客服消息(一)

以thinkphp5为实例,创建控制器 class Kf extends Controller { /** * [protected description]微信公众号appid * @var [type] */ protected $appid = "xxxxxxxxxxxxxxx"; /** * [protected......

半缘修道半缘君丶
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部