不维护
该库不再维护,我想请您考虑使用其他图书馆,例如https://git**hub.*com/fortawesome/angular-fontawesome。
Angular5 fontawesome
安装
npm install --save font-awesome angular2-fontawesome /* package.json */
"font-awesome": "~4.7.0" # Use any versions
"angular2-fontawesome": "~5.2.0"
角CLI
在package.json中,插入dependencies项块中的以下行:
我们可以使用Systemjs( systemjs.config.js )导入此库:
// .angular-cli.json
{
"apps" : [
// ...
"styles" : [
// Add this line
"../../node_modules/font-awesome/css/font-awesome.css"
]
// ..
]
} 用法
// src/app/app.module.ts
// ....
// Add this import statement
import { Angular2FontawesomeModule } from 'angular2-fontawesome/angular2-fontawesome'
// ....
@ NgModule ( {
declarations : [
AppComponent
] ,
imports : [
BrowserModule ,
Angular2FontawesomeModule // Add this line
] ,
providers : [ ] ,
bootstrap : [ AppComponent ]
} )
export class AppModule { } 参数
<!-- Component -->
< fa [name] = string // name of fontawesome icon
[size]=number // [1-5]
[flip]=string // [horizontal|vertical]
[pull]=string // [right|left]
[rotate]=number // [90|180|270]
[border]=boolean // [true|false]
[spin]=boolean // [true|false]
[fw]=boolean // [true|false]
[inverse]=boolean // [true|false]
> </ fa >
<!-- Directive -->
< i fa [name] = string // name of fontawesome icon
[size]=number // [1-5]
[flip]=string // [horizontal|vertical]
[pull]=string // [right|left]
[rotate]=number // [90|180|270]
[border]=boolean // [true|false]
[spin]=boolean // [true|false]
[fw]=boolean // [true|false]
[inverse]=boolean // [true|false]
> </ fa >姓名
< fa [name] =" 'rocket' " > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket " > </ i >
</ fa >
< i fa [name] =" 'rocket' " > </ i >
<!-- rendered -->
< i fa class =" fa fa-rocket " > </ i >尺寸
< fa [name] =" 'rocket' " [size] = 1 > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-lg " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [size] = 1 > </ i >
<!-- rendered -->
< i fa class =" fa fa-rocket fa-lg " > </ i >翻动
< fa [name] =" 'rocket' " [flip] =" 'horizontal' " > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-flip-horizontal " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [flip] =" 'horizontal' " > </ i >
<!-- rendered -->
< i fa class =" fa fa-rocket fa-flip-horizontal " > </ i >拉
< fa [name] =" 'rocket' " [pull] =" 'right' " > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-pull-right " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [pull] =" 'right' " > </ i >
<!-- rendered -->
< i class =" fa fa-rocket fa-pull-right " > </ i >旋转
< fa [name] =" 'rocket' " [rotate] = 90 > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-rotate-90 " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [rotate] = 90 > </ i >
<!-- rendered -->
< i class =" fa fa-rocket fa-rotate-90 " > </ i >边界
< fa [name] =" 'rocket' " [border] = true > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-border " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [border] = true > </ i >
<!-- rendered -->
< i fa class =" fa fa-rocket fa-border " > </ i >旋转
< fa [name] =" 'rocket' " [span] = true > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-span " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [span] = true > </ i >
<!-- rendered -->
< i class =" fa fa-rocket fa-span " > </ i >FW
< fa [name] =" 'rocket' " [fw] = true > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-fw " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [fw] = true > </ i >
<!-- rendered -->
< i class =" fa fa-rocket fa-fw " > </ i >逆
< fa [name] =" 'rocket' " [inverse] = true > </ fa >
<!-- rendered -->
< fa >
< i class =" fa fa-rocket fa-inverse " > </ i >
</ fa >
< i fa [name] =" 'rocket' " [inverse] = true > </ i >
<!-- rendered -->
< i class =" fa fa-rocket fa-inverse " > </ i > 开发这个库
npm install typings --globaltypings installnpm link # /example
npm install font-awesome
npm link angular2-fontawesome现在,您的更改下/src目录将得到反映。
npm unlink
托多
-
支持
fa-stack -
支持
fa-li和fa-ul - fastack -diractive
-
测试代码
- 在发布了Angular2指南之后
执照
(MIT许可证) - 版权(C)2018 Komei Shimamura
下载源码
通过命令行克隆项目:
git clone https://github.com/travelist/angular2-fontawesome.git