Question

我正在使用AngularJs ui-grid http://ui-grid.info/。

在实施时，我会在单元格的右下角看到以下img而不是下拉符号。

enter image description here

要包含哪些文件来解决此错误？

Answer 1

您需要下载字体文件：

ui-grid.woff
ui-grid.eot
ui-grid.svg
ui-grid.ttf

来自here的

。并将它们移到ui-grid.min.css生活的地方。

Answer 2

请以这种方式包含ui-grid CSS文件

<link rel="stylesheet" href="/release/ui-grid-unstable.css">

并省略作者教程或Api

中的脚本标记

<script src="/release/ui-grid-unstable.css"></script>

表示例如（http://ui-grid.info/docs/#/tutorial/102_sorting）

Answer 3

我只想为使用Grunt的人添加this answer（来自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'
                    ]
            }
    ]},

Answer 4

您可能还想查看最近添加的教程：http://ui-grid.info/docs/#/tutorial/116_fonts_and_installation

这包括如何正确安装字体，以及一点点麻烦。

Answer 5

另一种解决问题的方法是修改CSS类，如下所示

.ui-grid-icon-down-dir:before {
  content: '\25bc';
}
.ui-grid-icon-up-dir:before {
  content: '\25b2';
}

.ui-grid-selection-row-header-buttons.ui-grid-row-selected:before{
    content:'\2714' !important;
}
.ui-grid-all-selected:before{
    content:'\2714' !important;
}

Answer 6

尝试加入您的项目：

<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>

Answer 7

如果您使用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

});

Answer 8

{ 展开：true， cwd：＆＃39; bower_components / angular-ui-grid＆＃39;， src：[＆＃39; .eot＆＃39;，＆＃39; .svg＆＃39;，＆＃39; .ttf＆＃39;，＆＃39; .woff＆＃39]， dest：＆＃39;＆lt;％= yeoman.dist％＆gt; / styles＆＃39; } 将此代码添加到copy：{grunt文件中 dist：{

Answer 9

如果使用www.stackoverflow.com，则需要将ui-grid - v4.6.6和ui-grid.ttf放入文件夹ui-grid.woff中。因此目录的结构将如下所示：

fonts

ui-grid符号问题

9 个答案: