如何在Angular应用程序中使用材质设计图标

Question

我使用角度材料设计为我的AngularJS应用程序提供响应式设计。我正在使用材质设计图标，我使用以下方式安装这些图标：

bower install material-design-icons

然后我将css声明为CDN链接，即：

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

我通过以下方式使用这些图标：

<i class="material-icons md-36 md-dark">person</i>

我的问题是没有办法包含来自bower_components的css。我想用来自bower_components的本地源替换CDN源到css。但是我在我的bower_components中没有看到任何下载的css文件。

这是我的bower_components/material-design-icons目录的样子：

​

我按照Material icons guide中给出的说明操作，但是不知道如何在bower_components中包含CSS。

Answer 1

在materil-design-icons文件夹中有iconfont文件夹，其中包含所需的CSS文件。

Answer 2

有两种类型的材质设计图标...字体图标和svg图标

您所显示的标记用于字体图标

图标字体的bower包是material-design-iconfont

试试bower install material-design-iconfont ---save

Answer 3

如果我理解你的问题，你正试图在你的网页应用中使用材料设计。package material-design-icons就是图标info。我认为，为了实现你想要的东西，你应该得到鲍尔谷歌包material design lite info，他们还提供了一组templates

还有一个bootstrap material design。