Подтвердить что ты не робот

Вывод символов ui-grid

Я использую AngularJs ui-grid http://ui-grid.info/.

Во время реализации я получаю то, что вы видите в следующем img в правом углу ячейки, а не в раскрывающихся символах.

enter image description here

Какие файлы включить для решения этой проблемы?

4b9b3361

Ответ 1

Вам необходимо скачать файлы шрифтов:

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

из здесь. И перемещайте их там, где живет ваш ui-grid.min.css.

Ответ 2

Пожалуйста, включите ui-grid CSS файл таким образом

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

и опустить тег script из Учебника авторов или Api

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

например, (http://ui-grid.info/docs/#/tutorial/102_sorting)

Ответ 3

Я просто хотел бы добавить этот ответ (украденный дословно из panciz) для людей, использующих Grunt, которые хотели бы, чтобы они автоматически копировались. Это необходимо разместить в файле 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'
                    ]
            }
    ]},

Ответ 4

Вы также можете посмотреть недавно добавленный учебник: http://ui-grid.info/docs/#/tutorial/116_fonts_and_installation

В этом разделе рассказывается, как правильно установить шрифты и немного поработать с ошибками.

Ответ 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;
}

Ответ 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>

Ответ 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

});