介绍
cg-material是一个基于Angular Material的UI库，提供了一系列的组件和指令，能够快速、方便的在AngularJS项目中使用。cg-material采用npm作为包管理工具，并且支持Bower。
安装
安装cg-material前，需要确保已经安装好了Node.js和npm。
使用npm安装
在命令行中执行以下命令：
--- ------- ----------- ------
使用Bower安装
在命令行中执行以下命令：
----- ------- ----------- ------
使用
为了使用cg-material，需要通过模块的方式将其引入到项目中。在app.js文件中添加以下代码：
----------------------- ----------------
引入cgMaterial模块后，就可以在HTML代码中使用cg-material中提供的组件和指令了。例如，在controller中增加以下代码：
-----------------------
--------------------------- ---------------- -
------------ - -
------ ----- ----
------ ----- ----
------ ----- ---
--
---在HTML中使用cg-material的组件：
---------
------------- --------------- -- -------
-------------
---------------
----------这段代码会生成一个列表，包含三个元素。
常用组件和指令
md-button
md-button指令可以很方便地创建一个按钮。示例代码：
---------------- ---------------
md-checkbox
md-checkbox指令可以很方便地创建一个多选框。示例代码：
------------ --------------------- -------- --------------
md-radio-button
md-radio-button指令可以很方便地创建一个单选框。示例代码：
---------------- ------------------------- ---------------- ------ - ------------------ ---------------- ------------------------- ---------------- ------ - ------------------
md-input-container
md-input-container指令可以很方便地包装一个输入框。示例代码：
-------------------- ----------------------- ------ ----------- -------------------- ---------------------
md-select
md-select指令可以很方便地创建一个下拉框。示例代码：
---------- -------------------------- ---------- ---------------------- ------------- ---------- ---------------------- ------------- ------------
结束语
cg-material提供了许多方便的指令和组件，能够快速、方便地在AngularJS项目中使用。通过本文所介绍的内容，你应该已经能够掌握基本的使用方法，进一步深入学习请参考官方文档。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60055cb781e8991b448da3ce