title: dynamic, multiple provider for abstract class in angular 4
body: <p>I am using an abstract class to show some data from different sources. Every source is injected in the abstract class to show the data in a component.</p>
  
  <p>This is my Component, which is using the abstract class to get the data:</p>
  
  <pre><code>    import {AbstractclassService} from '../../../../abstractclass.service';
      import {Source2-Service} from '../../../../Source2.service';
      import {Source1-Service} from '../../../../Source1.service';
  
      @Component({
        selector: 'app-gauge',
        templateUrl: './gauge.component.html',
        providers: [
          {
            provide: AbstractclassService,
            useValue: Source1-Service , Source2-Service 
            multi: true
          }
      ],
       styleUrls: ['./gauge.component.css']
      })
  
      export class GaugeComponent implements  OnInit {
  
      data = [
          {
            name: 'test',
            value: 'test'
          }
        ];
  
        constructor( public abstractclassService: AbstractclassService  ) {}
  
  
        ngOnInit () {
  
          this.abstractclassService.onMessage = (msg: string) =&gt; {
            this.data = [{name: 'test', value: msg}];
        };
  
  
      }
  </code></pre>
  
  <p>And this is my <strong>abstract-class</strong> as service:</p>
  
  <pre><code>@Injectable()
  export abstract class AbstractclassService {
  
  
    public onMessage(msg: string): void {
      console.log("Testing");
    }
  
  }
  </code></pre>
  
  <p>Now, i didn't get it how to inject in <strong>useValue</strong> the different sources?</p>