Skip to content

Commit

Permalink
fix(features rollback): label visible property binding
Browse files Browse the repository at this point in the history
  • Loading branch information
BioPhoton committed Aug 16, 2017
1 parent 2aed0ac commit b3459ff
Show file tree
Hide file tree
Showing 2 changed files with 15 additions and 11 deletions.
22 changes: 13 additions & 9 deletions README.MD
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,9 @@ for a specific version.

Create an ```assets``` folder under your ```./src``` folder and copy the images from your ```./node_modules/angular-star-rating/assets/images``` folder into ```./src/assets/images```.

Also import the ```star.rating.scss``` file i.e. import it in your ```styles.scss``` file with ```@import "~angular-star-rating/assets/scss/star-rating";
```
In your ```app.module.ts``` import the ```StarRatingModule``` to your Angular `AppModule`:
```typescript
Expand Down Expand Up @@ -122,7 +125,7 @@ If something is not working check if

```typescript
import {Component} from "@angular/core";
import {IStarRatingOnClickEvent, IStarRatingOnRatingChangeEven, IStarRatingIOnHoverRatingChangeEvent} from "angular-star-rating/src/star-rating-struct";
import {OnClickEvent, OnRatingChangeEven, OnHoverRatingChangeEvent} from "angular-star-rating/src/star-rating-struct";

@Component({
selector: 'my-events-component',
Expand All @@ -141,21 +144,21 @@ import {IStarRatingOnClickEvent, IStarRatingOnRatingChangeEven, IStarRatingIOnHo
})
export class MyEventsComponent {

onClickResult:IStarRatingOnClickEvent;
onHoverRatingChangeResult:IStarRatingIOnHoverRatingChangeEvent;
onRatingChangeResult:IStarRatingOnRatingChangeEven;
onClickResult:OnClickEvent;
onHoverRatingChangeResult:OnHoverRatingChangeEvent;
onRatingChangeResult:OnRatingChangeEven;

onClick = ($event:IStarRatingOnClickEvent) => {
onClick = ($event:OnClickEvent) => {
console.log('onClick $event: ', $event);
this.onClickResult = $event;
};

onRatingChange = ($event:IStarRatingOnRatingChangeEven) => {
onRatingChange = ($event:OnRatingChangeEven) => {
console.log('onRatingUpdated $event: ', $event);
this.onRatingChangeResult = $event;
};

onHoverRatingChange = ($event:IStarRatingIOnHoverRatingChangeEvent) => {
onHoverRatingChange = ($event:OnHoverRatingChangeEvent) => {
console.log('onHoverRatingChange $event: ', $event);
this.onHoverRatingChangeResult = $event;
};
Expand Down Expand Up @@ -227,15 +230,16 @@ export class MyFormComponent {
- getHalfStarVisible

#### Label Modifier
**labelVisible**: string (Optional)
<!--
**labelVisible**: string (Optional)
The visibility of the label text.
Default: true
```html
<star-rating-comp [labelVisible]="false"></star-rating-comp>
```
<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/properties/prop-label-visible_false.PNG" width="290">

-->
**labelText**: string (Optional)
The text next to the stars.
Default: undefined
Expand Down
4 changes: 2 additions & 2 deletions src/star-rating.component.html
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
<div id="{{id}}"
<div id="{{id}}"
class="rating {{getComponentClassNames()}}"
tabindex="0"
(keydown)="onKeyDown($event)"
(blur)="onBlur($event)"
(focus)="onFocus($event)"
(mouseleave)="onStarHover(0)">
<div *ngIf="labelVisible" class="label-value">{{labelText}}</div>
<div *ngIf="labelText" class="label-value">{{labelText}}</div>
<div class="star-container">
<div class="star"
(mouseenter)="onStarHover(star)"
Expand Down

0 comments on commit b3459ff

Please sign in to comment.