我想在Angular组件中保留所有评分的平均费率,但是我不知道如何做到这一点。我正在使用Bootstrap文档研究Angular,但这确实没有帮助。
这是模板rating.ts文件:
import {Component} from '@angular/core';
@Component({
selector: 'ngbd-rating-template',
templateUrl: './rating-template.html',
styles: [`
.star {
font-size: 1.5rem;
color: #b0c4de;
}
.filled {
color: #1e90ff;
}
.bad {
color: #deb0b0;
}
.filled.bad {
color: #ff1e1e;
}
`]
})
export class NgbdRatingTemplate {
average = 0;
count = 0;
currentRate = 6;
avg() {
this.average = (this.average*this.count + this.currentRate) / (this.count + 1);
this.count += 1;
}
}
以及HTML文件:
<ngb-rating [(rate)]="currentRate" (rateChange)="avg()">
<ng-template let-fill="fill" let-index="index">
<span class="star" [class.filled]="fill === 100" [class.bad]="index < 3">★</span>
</ng-template>
</ngb-rating>
<hr>
<pre>Rate: <b>{{currentRate}}</b></pre>
<div> {{average}} </div>
但这不是我想要的,因为它仅适用于费率变化。
我需要您的建议,我不必使用ngb-rating模块btw,如果您对评分有更好的想法,我会很高兴学习这些。