Question

我正在使用angularJs中的md-badge来显示用户收到的通知数。但是由于某种原因，css样式（来自模块）可能已被覆盖。从文档中可以看出，在标记中使用“ md-bage = number”时，您应该看到一个带有#number的小圆圈。就我而言，我看到一个巨大的数字，周围有一个正方形，我不明白为什么。

这是html代码：

<icon
  click-on="vm.clickOnNotifications"
  tooltip=vm.tooltip
  icon="'notifications'"
  md-badge={{vm.notificationsCounter}}
  md-badge-fill="white"
  md-badge-color=":red"
>
</icon>

这是我检查页面时生成的html代码：

<div class="md-badge" style="position: absolute; color: rgb(244, 67, 54); background-color: white; display: initial; left: 397px; top: 29px;">3</div>

这是官方文档，其外观应为： https://jmouriz.github.io/angular-material-badge/demo/demo.html

这就是我所看到的： https://imgur.com/a/Dk12qK7

有什么主意吗？我应该在这里发送什么额外信息？谢谢！

这是我的gruntfile代码（部分代码）：

injector: {
      options: {
        ignorePath: 'static/'
      },
      dev: {
        files: {
          'static/index.html': [
            'static/app/app.js',
            'static/app/app.config.js',
            'static/app/**/*Module.js',
            'static/app/**/*Route.js',
            'static/app/**/*Ctrl.js',
            'static/app/**/*Service.js',
            'static/app/**/*Directive.js'
          ]
        }
      },
      production: {
        files: {
          'static/index.html': [
            'static/app/assets/css/**/*.css',
            'static/app/assets/js/*.js'
          ]

        }
      }
    },

（obs：这样就可以了）
我已将angular-material-badge / angular-material-badge.css文件复制到asset / css /中的文件夹中，因此grunt文件可以将其放入索引文件中。当我运行grunt dev时，我的索引如下：

<!-- injector:css -->
    <link rel="stylesheet" href="/app/assets/css/angular-loading-bar/loading-bar.css">
    <link rel="stylesheet" href="/app/assets/css/angular-material-badge/angular-material-badge.css">
    <link rel="stylesheet" href="/app/assets/css/angular-material-data-table/md-data-table.css">
    <link rel="stylesheet" href="/app/assets/css/angular-material-icons/angular-material-icons.css">
    <link rel="stylesheet" href="/app/assets/css/angular-material/angular-material.css">
    <link rel="stylesheet" href="/app/assets/css/style.css">

~~徽章中的CSS仍然很奇怪。~~
解决了，谢谢约翰=）

带有md徽章的怪异CSS：在数字周围加上正方形而不是圆圈

0 个答案: