twitter-bootstrap ui-grid 符号问题
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26651918/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ui-grid symbols issue
提问by Anup
I am using AngularJs ui-grid http://ui-grid.info/.
我正在使用 AngularJs ui-grid http://ui-grid.info/。
While implementing, I get something which you can see in the following img in right corner of the cell instead of dropdown symbols.
在实现时,我得到了一些你可以在单元格右角的以下 img 中看到的东西,而不是下拉符号。


Which files to include to solve this bug?
要包含哪些文件来解决此错误?
回答by Rahil Wazir
回答by Felix
Please include ui-grid CSS file by this way
请通过这种方式包含 ui-grid CSS 文件
<link rel="stylesheet" href="/release/ui-grid-unstable.css">
and ommit the script tag from the Authors Tutorial or Api
并省略作者教程或 Api 中的脚本标签
<script src="/release/ui-grid-unstable.css"></script>
回答by Adam Plocher
I would just like to add this answer(stolen verbatim from panciz) for the folks using Grunt who would like to have these automatically copied. This needs to be placed in your Gruntfile.js:
我只想为使用 Grunt 的人添加这个答案(从 panciz 中窃取的逐字逐字),他们希望自动复制这些答案。这需要放在你的 Gruntfile.js 中:
copy: {
dist: {
files: [
...
//font di ui grid
{
expand: true,
flatten: true,
dest: 'dist/styles/',
src: ['bower_components/angular-ui-grid/ui-grid.ttf',
'bower_components/angular-ui-grid/ui-grid.woff',
'bower_components/angular-ui-grid/ui-grid.eot',
'bower_components/angular-ui-grid/ui-grid.svg'
]
}
]},
回答by PaulL
You may also want to look at a recently added tutorial: http://ui-grid.info/docs/#/tutorial/116_fonts_and_installation
您可能还想查看最近添加的教程:http: //ui-grid.info/docs/#/tutorial/116_fonts_and_installation
This covers how to install the fonts correctly, and a little bit of trouble shooting.
这包括如何正确安装字体,以及一些故障排除。
回答by Yogesh
Another way to solve the issue is modify the CSS class as follows
另一种解决问题的方法是修改CSS类如下
.ui-grid-icon-down-dir:before {
content: 'bc';
}
.ui-grid-icon-up-dir:before {
content: 'b2';
}
.ui-grid-selection-row-header-buttons.ui-grid-row-selected:before{
content:'14' !important;
}
.ui-grid-all-selected:before{
content:'14' !important;
}
回答by Fabien Thetis
Try to include in your project :
尝试包含在您的项目中:
<link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.css">
<script src="https://cdn.rawgit.com/angular-ui/bower-ui-grid/master/ui-grid.min.js"></script>
回答by Rohit Parte
{ expand: true, cwd: 'bower_components/angular-ui-grid', src: ['.eot', '.svg', '.ttf', '.woff'], dest: '<%= yeoman.dist %>/styles' } add this code to grunt file at copy: { dist: {
{ expand: true, cwd: 'bower_components/angular-ui-grid', src: [' .eot', '.svg', ' .ttf', '.woff'], dest: '<%= yeoman.dist %>/styles' } 在复制时将此代码添加到 grunt 文件中:{ dist: {
回答by Belter
If you use ui-grid - v4.6.6, you need to put ui-grid.ttfand ui-grid.woffinto folder fonts. So the structure of directory will looks like this:
如果你使用ui-grid - v4.6.6,你需要把ui-grid.ttf和ui-grid.woff成文件夹fonts。所以目录的结构将如下所示:
ui-grid.min.css
fonts # <-- this is a folder
ui-grid.ttf # <-- in fonts folder
ui-grid.woff # <-- in fonts folder
回答by Matt
If you are using gulp, add this task.
如果您正在使用gulp,请添加此任务。
gulp.task('styles', function() {
// Copy font files needed for angular-ui-grid
gulp.src(['bower_components/angular-ui-grid/ui-grid.ttf',
'bower_components/angular-ui-grid/ui-grid.woff',
'bower_components/angular-ui-grid/ui-grid.eot',
'bower_components/angular-ui-grid/ui-grid.svg'
])
.pipe(gulp.dest('dist/styles/'))
// Other style tasks here
});

