css - 在 ionic 中实现半星

Question

基本上，我有一个带有评级模块的 ionic 移动应用程序。但是，当我得到的平均值不是整数时，我很难知道如何实现半星。所以我做了什么我把它四舍五入了。并显示 ionic 图标星。这些是我的代码，

     <span *ngIf="item.rating" class="review">     
      {{item.rating}}
      <ion-icon name="star" *ngIf="Round(item.rating) > 0"></ion-icon>
      <ion-icon name="star" *ngIf="Round(item.rating) > 1"></ion-icon>
      <ion-icon name="star" *ngIf="Round(item.rating) > 2"></ion-icon>
      <ion-icon name="star" *ngIf="Round(item.rating) > 3"></ion-icon>
      <ion-icon name="star" *ngIf="Round(item.rating) > 4"></ion-icon>
    </span>

我想去掉四舍五入并显示半星我该怎么做？

Answer 1

请看本库https://www.npmjs.com/package/ionic2-rating

安装:

npm install --save ionic2-rating

用法:

<rating
 [(ngModel)]="0.5"
 readOnly="true"
 max="5"
 emptyStarIconName="star-outline"
 halfStarIconName="star-half"
 starIconName="star"
 nullable="false">
</rating>