Vstavljanje enega storitvenega razreda v drugega v Angular

Za delo na projektu bomo morda potrebovali vstaviti en storitveni razred v drugega, da razširimo njihovo funkcionalnost. Naredimo še en storitveni razred, ki bo izpisoval sporočila v konzolo pri dodajanju novih podatkov.

Najprej v mapi test/src/app ustvarimo datoteko log.service.ts. Izvozimo razred LogService, v katerem bomo napisali funkcijo write za izpis sporočila v konzolo:

log.service.tsimport { Injectable } from '@angular/core';

@Injectable()
export class LogService {
  write(message: string) {
    console.log(message);
  }
}

Nato gremo v naš storitveni razred DataService in uvozimo, injektiramo in uporabimo naš novi storitveni razred:

app/data.service.tsimport { Injectable } from '@angular/core';
import { LogService } from './log.service'; // uvozimo

@Injectable()
export class DataService {
  private data: string[] = ['a', 'b', 'c'];
  
  constructor(private logService: LogService) { // injektiramo
    
  }
  
  getData(): string[] {
    this.logService.write('podatki prejeti'); // uporabimo
    return this.data;
  }
  
  addData(name: string){
    this.data.push(name);
    this.logService.write('dodan nov element'); // uporabimo
  }
}

Toda tega ni dovolj. Novi storitveni razred je treba dodati tudi v razred komponente, čeprav tam ni neposredno uporabljen:

app/app.component.tsimport { Component } from '@angular/core';
import {DataService} from './data.service';
import {LogService} from './log.service'; // uvozimo

@Component({
  ........
  providers: [DataService, LogService] // dodamo
})