在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML5/ Angular4 星級(jí)評(píng)價(jià)功能定位基礎(chǔ)問(wèn)題

Angular4 星級(jí)評(píng)價(jià)功能定位基礎(chǔ)問(wèn)題

現(xiàn)在的效果是點(diǎn)一下,五個(gè)實(shí)心全變成空心了,如何定位并返回定位的星數(shù)呢?
代碼如下 :

Template:

<a><i class="fa fa-star" *ngFor = "let star of stars" [class.fa-star-o]="starCtrl" (click)="clickStars(i)"></a>

// 注:class="fa fa-star" 實(shí)心星星
//class="fa fa-star-o" 空心星星

Ts:

private stars: any;
private starCtrl: boolean;
ngOnInit(): void {
  this.stars = [true,true,true,true,true]
}

clickStars(i: number){
  this.starCtrl = true;
}
回答
編輯回答
忠妾

template

<a><i class="fa fa-star" *ngFor = "let star of stars;let i = index" [class.fa-star-o]="star" (click)="clickStars(i)"></a>

ts


clickStars(i: number){
  this.stars = this.stars.map((_, n) => n <= i)
}
2018年7月15日 04:29