Bootstrap图标在Angular2中无法显示

31

我想在我的Angular2应用程序中使用Bootstrap图标。我已经使用命令npm install bootstrap --save安装了Bootstrap。

我的代码片段如下:

 <button *ngIf="pos.name == uname" type="button" class="btn btn-default       btn-sm delete" (click)="DeleteBulletin();">
   <span class="glyphicon glyphicon-trash glyph"></span>  Delete
 </button>

我已将Bootstrap包含在我的styleUrls中 - styleUrls:['node_modules/bootstrap/dist/css/bootstrap.min.css','app/home.component.css']

图标显示如下 - 输入图片描述


5
请看这里:http://stackoverflow.com/questions/35659094/bootstrap-glyphicon-not-showing-in-form/35660280#35660280 - Arthur Tsidkilov
您可以检查控制台是否出现“404”错误,以确定字体文件的加载情况。 - Maximilian Riegler
2
FYI,Bootstrap 4已经放弃了Glyphicon图标字体。 - xtof
删除了Glyphicons图标字体。如果您需要图标,一些选项是: Glyphicons的上游版本 Octicons Font Awesome - pearpages
11个回答

0

我做了和 @Sebastian Viereck 一样的事情。但是我做了

npm install --save-dev @fortawesome/fontawesome-free

在 angular.json 文件中

"styles": ["node_modules/bootstrap/dist/css/bootstrap.css",
           "node_modules/@fortawesome/fontawesome-free/css/all.min.css",
            "src/styles.css"
 ],

看起来fontawesome有一个新的付费版本


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接