【问题标题】:Implementing half stars in ionic在离子中实现半星
【发布时间】:2018-08-15 14:15:20
【问题描述】:

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

     <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>

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

【问题讨论】:

  • 图标星星可以减半吗?

标签: css angularjs typescript ionic-framework ionic2


【解决方案1】:

https://www.npmjs.com/package/ionic2-rating

npm install --save ionic2-rating

也为我工作,包括半分。
CSS 自定义也在那里。

【讨论】:

    【解决方案2】:

    请看这个库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>
    

    【讨论】:

      【解决方案3】:

      如果你有时间使用这个库 https://github.com/fraserxu/ionic-rating

      否则您可以使用引导程序。 实施该技术会增加代码复杂性,不被视为良好做法。

      【讨论】:

      • 你能帮我如何使用引导程序吗?
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2015-08-11
      • 2016-01-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-04-25
      • 1970-01-01
      相关资源
      最近更新 更多