极客教程Angular Material复选框
Angular Material库是一个由Angular团队创建的UI组件库，用于创建桌面和移动Web应用程序的设计组件。要安装它，我们需要在我们的项目中安装Angular。完成后，使用下面的命令来下载它。当我们需要从给我们的多个选项中选择一个或多个选项时，就会用到复选框。Angular指令<mat-checkbox>被用来提供一个具有材料设计风格和动画功能的升级版复选框。使用Angular Material绘制复选框控件所需的设置将在本文中演示。
语法:
注：<mat-checkbox>提供了与原生相同的功能，<input type="checkbox"> ，并以Material Design的风格和动画进行了增强。
安装:
最基本的要求是在系统中安装Angular CLI，以便添加和配置Angular Material库。满足所需条件后，我们可以使用Angular CLI来运行以下命令。
有关安装和设置的详细信息，请参考这篇文章。
添加复选框组件：
MatCheckboxModule “必须从我们应用程序的app.module.ts文件中的”@angular/material/checkbox “导入。
步骤依次为：
- 使用上述命令来安装角质材料。
- 完成安装后在app.module.ts文件中从’@angular/material/checkbox’导入’MatCheckboxModule’。
- 我们可以通过直接使用
< mat-checkbox>标签来使用进度条。 - 我们需要给该标签一个值属性，以表明进度。
- 在你完成了前面的阶段后，你可以服务于或开始这个项目。
复选框：该<mat-checkbox>元素将复选框标签作为其内容。将’labelPosition’属性设置为’before’或’after’将把标签放在复选框的前面或后面。
不确定的复选框：类似于本地< input type=”checkbox”> ，mat-checkbox>允许一个不确定的状态。如果indeterminate属性为 “真”，那么无论检查值如何，该复选框都将显示为不确定状态。如果用户与复选框进行交互，不确定状态将被移除。
禁用的复选框：用户不能使用这个复选框。disabled属性决定了一个复选框是否应该被禁用。一个停用的元素是不能点击的，也不能发挥作用。浏览器通常默认将禁用的组件描绘成灰色。
复选框也可以有不同的主题或颜色，分别是原色、重点色和暖色。
让我们看一个例子，在这个例子中我们实现了上述所有情况。
示例:
输出:
