import { Component , Input , forwardRef } from '@angular/core' ; import { NG_VALUE_ACCESSOR , ControlValueAccessor } from '@angular/forms' ; @ Component ( { selector : 'lsu-rating' , template : `
    <div class="ui {{ type }} {{ size }} rating">
      <i class="icon" *ngFor="let item of ratings" [ngClass]="{'active': item <= rating }" (click)="setRating(item)"></i>
    </div>
  ` , providers : [ { provide : NG_VALUE_ACCESSOR , useExisting : forwardRef ( ( ) => RatingComponent ) , multi : true } ] } ) export class RatingComponent implements ControlValueAccessor { @ Input ( ) public set maxRating ( val ) { this . _maxRating = val ; if ( this . rating > val ) { this . setRating ( val ) ; } this . ratings = this . getRatings ( val ) ; } public get maxRating ( ) : number { return this . _maxRating ; } protected _maxRating : number = 1 ; @ Input ( ) public rating : number = 0 ; @ Input ( ) public type : string = "star" ; @ Input ( ) public size : string = "" ; ratings : Array < number > ; _onChange = ( _ ) => { } ; _onTouched = ( ) => { } ; constructor ( ) { } public writeValue ( value ) { this . rating = value ; this . _onChange ( value ) ; } public registerOnChange ( fn ) { this . _onChange = fn ; } public registerOnTouched ( fn ) { this . _onTouched = fn ; } public ngOnInit ( ) { this . type = this . type . toLowerCase ( ) ; this . size = this . size . toLowerCase ( ) ; this . ratings = this . getRatings ( this . maxRating ) ; } getRatings ( size ) { let ratings = [ ] ; for ( let i = 0 ; i < size ; i ++ ) { ratings . push ( i + 1 ) ; } return ratings ; } setRating ( item ) { this . writeValue ( item ) ; } }