docs(example): added examples for overriding the config service

apps/angular5-example/src/app/app.module.ts

@@ -23,8 +23,8 @@ const DECLARATIONS = [
     BrowserModule,
     NxModule.forRoot(),
     ReactiveFormsModule,
-    StarRatingModule.forRoot(),
     StaticModuleModule,
+    StarRatingModule.forRoot(),
     RouterModule.forRoot([
       {
         path: '',

apps/angular5-example/src/app/lazy-module/custom-config/custom-config.component.ts → apps/angular5-example/src/app/lazy-module/custom-config.component.ts

@@ -3,7 +3,7 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   selector: 'custom-config',
   template: `
-  <h1>Custom static configuration</h1>
+  <h1>Custom static configuration in lazy module</h1>
   <star-rating-comp></star-rating-comp>
   <custom-local-config></custom-local-config>
   `

apps/angular5-example/src/app/lazy-module/custom-config.service.ts

@@ -0,0 +1,11 @@
+import { Injectable } from '@angular/core';
+import {StarRatingConfigService, StarRatingConfig} from '@angular-star-rating-lib/angular-star-rating';
+
+@Injectable()
+export class CustomConfigService extends StarRatingConfigService {
+
+  constructor() {
+    super();
+    this.numOfStars = 10;
+  }
+}

apps/angular5-example/src/app/lazy-module/custom-local-config.component.ts

@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core';
+import {CustomLocalConfigService} from './custom-local-config.service';
+import {StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
+
+@Component({
+  selector: 'custom-local-config',
+  template: `
+  <h2>Custom local config in lazy module</h2>
+  <star-rating-comp></star-rating-comp>`,
+  providers: [
+    {
+      provide: StarRatingConfigService, useClass: CustomLocalConfigService
+    }
+  ]
+})
+export class CustomLocalConfigComponent implements OnInit {
+  constructor() {}
+
+  ngOnInit() {}
+}

apps/angular5-example/src/app/lazy-module/custom-local-config.service.ts

@@ -0,0 +1,11 @@
+import { Injectable } from '@angular/core';
+import {StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
+
+@Injectable()
+export class CustomLocalConfigService extends StarRatingConfigService {
+
+  constructor() {
+    super();
+    this.size = 'small';
+  }
+}

apps/angular5-example/src/app/lazy-module/lazy-module.module.ts

@@ -1,21 +1,27 @@
-import {StarRatingModule} from '@angular-star-rating-lib/angular-star-rating';
+import {StarRatingModule, StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { CustomConfigComponent } from './custom-config/custom-config.component';
-import { CustomLocalConfigComponent } from './custom-local-config/custom-local-config.component';
+import { CustomConfigComponent } from './custom-config.component';
+import { CustomLocalConfigComponent } from './custom-local-config.component';
+import { CustomConfigService } from './custom-config.service';
 
 @NgModule({
   imports: [
     CommonModule,
     StarRatingModule.forChild(),
     RouterModule.forChild([
-      {
+            {
         path: '',
         component: CustomConfigComponent
       }
     ])
   ],
-  declarations: [CustomConfigComponent, CustomLocalConfigComponent]
+  declarations: [CustomConfigComponent, CustomLocalConfigComponent],
+  providers: [
+    {
+      provide: StarRatingConfigService, useClass: CustomConfigService
+    }
+  ]
 })
 export class LazyModuleModule {}

apps/angular5-example/src/app/static-module/custom-config.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'custom-config',
+  template: `
+  <h1>Custom static configuration in static module</h1>
+  <star-rating-comp></star-rating-comp>
+  <custom-local-config></custom-local-config>
+  `
+})
+export class CustomConfigComponent implements OnInit {
+  constructor() {}
+
+  ngOnInit() {}
+}

apps/angular5-example/src/app/static-module/custom-config.service.ts

@@ -0,0 +1,12 @@
+import { Injectable } from '@angular/core';
+import {StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
+
+@Injectable()
+export class CustomConfigService extends StarRatingConfigService {
+
+  constructor() {
+    super();
+    this.numOfStars = 3;
+    this.staticColor = 'positive'
+  }
+}

apps/angular5-example/src/app/static-module/custom-local-config.component.ts

@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core';
+import {CustomLocalConfigService} from './custom-local-config.service';
+import {StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
+
+@Component({
+  selector: 'custom-local-config',
+  template: `
+  <h2>Custom local config in static module</h2>
+  <star-rating-comp></star-rating-comp>`,
+  providers: [
+    {
+      provide: StarRatingConfigService, useClass: CustomLocalConfigService
+    }
+  ]
+})
+export class CustomLocalConfigComponent implements OnInit {
+  constructor() {}
+
+  ngOnInit() {}
+}

apps/angular5-example/src/app/static-module/custom-local-config.service.ts

@@ -0,0 +1,11 @@
+import { Injectable } from '@angular/core';
+import {StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
+
+@Injectable()
+export class CustomLocalConfigService extends StarRatingConfigService {
+
+  constructor() {
+    super();
+    this.size = 'small';
+  }
+}

apps/angular5-example/src/app/static-module/static-module.module.ts

@@ -1,10 +1,10 @@
-import { NgModule } from '@angular/core';
+import {StarRatingModule, StarRatingConfigService} from '@angular-star-rating-lib/angular-star-rating';
 import { CommonModule } from '@angular/common';
-
-import { CustomConfigComponent } from './custom-config/custom-config.component';
-import { CustomLocalConfigComponent } from './custom-local-config/custom-local-config.component';
+import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { StarRatingModule } from '@angular-star-rating-lib/angular-star-rating';
+import { CustomConfigComponent } from './custom-config.component';
+import { CustomLocalConfigComponent } from './custom-local-config.component';
+import { CustomConfigService } from './custom-config.service';
 
 @NgModule({
   imports: [
@@ -17,6 +17,11 @@ import { StarRatingModule } from '@angular-star-rating-lib/angular-star-rating';
       }
     ])
   ],
-  declarations: [CustomConfigComponent, CustomLocalConfigComponent]
+  declarations: [CustomConfigComponent, CustomLocalConfigComponent],
+  providers: [
+    {
+      provide: StarRatingConfigService, useClass: CustomConfigService
+    }
+  ]
 })
 export class StaticModuleModule {}

libs/angular-star-rating/src/services/star-rating-config.service.ts

@@ -216,4 +216,5 @@ export class StarRatingConfigService implements StarRatingConfig {
   getHalfStarVisible(rating: number): boolean {
     return Math.abs(rating % 1) > 0;
   }
+
 }

libs/angular-star-rating/src/services/star-rating.ts

@@ -106,11 +106,11 @@ export class StarRating {
    */
   protected _staticColor: starRatingColor;
   get staticColor(): starRatingColor {
-    return this._staticColor;
+    return this._staticColor || this.config.staticColor || undefined;
   }
 
   set staticColor(value: starRatingColor) {
-    this._staticColor = value || this.config.staticColor || undefined;
+    this._staticColor = value;
 
     //update color.
     this.setColor();