angularjs 想要的打印布局不正确答案

【问题标题】：angularjs wanted print layout wont be correctangularjs 想要的打印布局不正确
【发布时间】：2016-10-05 09:30:38
【问题描述】：

我目前正在使用这个：

<li ng-repeat="items in ferdigheter">{{ items.title}}
<div class="circles">
    <div class="circle" ng-repeat="a in thisnumber(items.stars)"></div>
    <div class="empty_circle" ng-repeat="a in thisnumber(items.maxstars - items.stars)"></div>

</div>
</li>

当我查看打印的内容时 (ctrl+p) 标题在那里，但圆圈/空圆圈不在打印中。知道为什么吗？

我怎样才能确保圆圈也会被打印出来？

当前页面：

当前打印：

想要打印：

更新：

范围：

  $scope.ferdigheter = [
        {tittel: 'Adobe Photoshop', stars: 2, maxstars: 5},
        {tittel: 'CSS/html', stars: 5, maxstars: 5},
        {tittel: 'PHP', stars: 4, maxstars: 5},
        {tittel: 'Angular', stars: 3, maxstars: 5},
        {tittel: 'Javascript', stars: 4, maxstars:5},
        {tittel: 'MS Word', stars: 4, maxstars: 5},
        {tittel: 'Dreamviewer', stars: 2, maxstars: 5},
        {tittel: 'Phpstorm', stars: 4, maxstars: 5},
        {tittel: 'Codeigniter', stars: 5, maxstars: 5},
        {tittel: 'XXX', stars: 3, maxstars: 5},
        {tittel: 'XXX', stars: 5, maxstars: 5},

    ];

作用域thisnumber 创建一个数组

【问题讨论】：

这似乎是 CSS 的问题，而不是 angularjs 的问题。

标签： javascript angularjs

【解决方案1】：

用于打印的 CSS 样式可能很棘手。例如，在 Chrome 中，您可能需要使用 -webkit-print-color-adjust:exact; 才能正常工作。

在此处查看更完整的答案： https://stackoverflow.com/a/15253634/55154

【讨论】：

通过将该属性添加到样式表中的 circle 类很容易尝试。例如，如果您通过使用背景颜色来设置圈子的样式，它应该可以在 Chrome 中使用。
ie呢？
在 IE 中无法做到这一点。似乎有一些解决方法，比如使用非常厚的边框而不是背景等，但正如我所说的那样，它变得很棘手，这是我对主题的了解。对不起。