在angular中引入iconfont字体图标

iconfont地址
选中后，放在自己的项目文件夹中
此时需要设置文件（项目行中有更多操作，选中编辑项目）
family：cloudicon_
前缀：cloudicon，生成的文件为：

font-family: "cloudicon_";
.cloudicon-edit:before { content: "\e600"; }

iconfont网站下载文件后：

iconfont.scss：

@font-face {font-family: "cloudicon_";
  src:
  url('../../assets/fonts/iconfont.eot?t=1536286823562'),/* IE9*/
  url('../../assets/fonts/iconfont.woff?t=1536286823562') format('woff'), /* IE9*/
  url('../../assets/fonts/iconfont.ttf?t=1536286823562') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('../../assets/fonts/iconfont.svg?t=1536286823562#cloudicon_') format('svg'); /* iOS 4.1- */
}


.cloudicon_ {
  font-family:"cloudicon_" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.cloudicon-open:before { content: "\e600"; }

此时使用icon的时候，需要:

<i class="cloudicon_ cloudicon-open"></i>

我们只用一个类就生成icon
修改：

[class^='cloudicon-'],[class*='cloudicon']{
  font-family: 'cloudicon_' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

照样可以使用！

<i class=" cloudicon-open"></i>

注意：在引入四个文件时，路径是有问题的，少了一个层级！！！

参考：https://www.jianshu.com/p/68bf0b03d6a2