Angular Material 小部件
Angular Material 提供了丰富的 UI 小部件库。这允许用户与应用程序具有高级交互能力。
下表列出了一些重要的 Widgets 附上他们的描述:
序号 | 小部件和描述 |
---|---|
1 |
Buttons
The md按钮 ,一个 Angular 指令,是一个按钮指令,具有可选的墨水波纹(默认情况下启用)。如果 href or ng-href 如果提供了属性,则该指令充当锚元素。 |
2 |
复选框
The md-复选框 ,一个 Angular 指令,用作复选框控件。 |
3 |
Content
The md-内容 ,一个 Angular 指令,是一个容器元素,用于可滚动的内容。这 布局填充 可以添加属性来填充内容。 |
4 |
DatePicker
The md-datepicker ,一个角度指令,是一个选择日期的输入控件。它还支持 ngMessages 进行输入验证。 |
5 |
Dialogs
The md 对话框 ,一个Angular Directive,是一个容器元素,用于显示一个对话框。它的元素 md-对话框内容 包含对话框的内容和 md-对话框操作 负责对话动作。 The mdDialog ,一个 Angular 服务,在应用程序上打开一个对话框,让用户了解并帮助他们做出决定。 |
6 |
Divider
The md 分频器 ,一个角度指令,是一个规则元素,用于显示一个细的轻量级规则,以对列表和页面布局中的内容进行分组和划分。 |
7 |
List
The md-list ,一个 Angular 指令,是一个容器组件,包含 md 列表项 作为孩子的元素。 md-list-item 指令是 md-list 容器的行项目的容器组件。 CSS 类 md-2 线 and md-3 线 可以添加到 md-list-item 以分别增加 22px 和 40px 的行高。 |
8 |
Menu
The md-menu ,一个 Angular 指令,是一个组件,用于在执行的操作的上下文中显示附加选项。这 md-menu 有两个子元素。第一个元素是 触发元件 并用于打开菜单。第二个元素是 md 菜单内容 表示菜单打开时的菜单内容。 md-menu-content 通常将菜单项作为 md-menu-item 携带。 |
9 |
Menu Bar
The md 菜单栏 , 是一个容纳多个菜单的容器组件。菜单栏有助于创建操作系统提供的菜单效果。 |
10 |
进度条
The md-进度-循环 and md-progress-linear 是 Angular 进度指令,用于在应用程序中显示加载内容消息。 |
11 |
单选按钮
The md-广播组 and md 单选按钮 Angular 指令用于在应用程序中显示单选按钮。 md-radio-group 是 md-radio-button 元素的分组容器。 |
12 |
Selects
The md-选择 , Angular 指令用于显示选择框,以 ng-model 为界。 |
13 |
Fab 工具栏
The md-fab-工具栏 ,一个 Angular 指令,用于显示元素或按钮的工具栏,以便快速访问常用操作。 |
14 |
Sliders
The md-滑块 , Angular 指令用于显示范围组件。它有两种模式:
|
15 |
Tabs
The md-tabs and md-tab Angular 指令用于在应用程序中显示选项卡。 md-tabs 是 md-tab 元素的分组容器。 |
16 |
Toolbars
The md 工具栏 , Angular 指令用于显示工具栏,该工具栏通常是内容上方的区域,用于显示标题和相关按钮。 |
17 |
Tooltips
Angular Material 提供了各种特殊的方法来向用户显示不显眼的工具提示。 Angular Material 提供了为它们分配方向的方法,并且 md-tooltip 指令用于显示工具提示。每当用户聚焦、悬停或触摸父组件时,都会激活工具提示。 |
18 |
Chips
The md-chips Angular 指令,用作称为芯片的特殊组件,可用于表示一小组信息,例如联系人、标签等。自定义模板可用于渲染芯片的内容。这可以通过将具有自定义内容的 md-chip-template 元素指定为 md-chips 的子元素来实现。 |
19 |
接触芯片
The md-接触芯片 ,一个 Angular 指令,是一个建立在 md 芯片上的输入控件,并使用 md-自动完成 元素。联系人芯片组件接受一个查询表达式,该表达式返回一个可能的联系人列表。用户可以选择其中之一并将其添加到可用芯片列表中。 |