使用 AngularUI Star Rating 更改星星的颜色并显示半星评级答案

【问题标题】：Changing the color of the stars and display half star rating using AngularUI Star Rating使用 AngularUI Star Rating 更改星星的颜色并显示半星评级
【发布时间】：2014-05-14 04:15:15
【问题描述】：

我正在使用 Angular UI 星级评分，但我想执行以下 2 项。非常感谢任何帮助！

我想将所选星的颜色（“stateOn: glyphicon-star”）更改为黄色。有没有办法做到这一点？
我也想显示半星。例如，我想显示 3 1/2 颗星。你能告诉我怎么做吗？

这是 AngularUI 中星级评分的评分标签：

<rating value="rate" max="max" readonly="isReadonly" on-hover="hoveringOver(value)" on-leave="overStar = null" </rating>

【问题讨论】：

标签： angularjs css angular-ui-bootstrap

【解决方案1】：

Half stars 将对逻辑和可能的 CSS 进行一些更改（我想如果它在绘制了它应该为 floored 值的星数后有余数，然后在一个宽度为一半的容器中绘制一个星，然后没有溢出，或者只是制作一个半星图标）。您可以简单地在自己的 CSS 中覆盖的颜色，例如

.glyphicon-star, .glyphicon-star-empty {
  color:yellow;
}

【讨论】：

谢谢。我希望有一个更具体的答案。在重新阅读您的答案几次之后，我想我知道该怎么做才能获得 1/2 星评级。我能够像你说的那样使用 css 类来改变星星的颜色。
SO 不是让别人为你工作的地方。当你完成一些工作时，这是一个寻求帮助的地方。鉴于没有提供任何可用于工作的代码，我给出了最好的答案来让您继续前进，感谢您的接受。将来请提供一个 plunkr 显示您正在做什么，您将获得更多帮助。
只是为了完成孔的东西，如果你想改变一些大小，你可以添加 font-size: 30px;也是。 :) 事实上很好的答案！

【解决方案2】：

.glyphicon-star : before, .glyphicon-star-empty: before{
  color:yellow;
}

这也会导致同样的结果

【讨论】：