Убризање једног сервиса у други у Angular-у

За рад на пројекту можда ће нам требати да убриземо један сервис у други како бисмо проширили њихову функционалност. Хајде да направимо још један сервис који ће исписивати поруке у конзолу при додавању нових података.

На почетку у фолдеру test/src/app креирамо фајл log.service.ts. Извезимо класу LogService, у којој ћемо написати функцију write за испис поруке у конзолу:

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

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

Затим идемо у наш сервис DataService и увезимо, инжектујемо и користимо наш нови сервис:

app/data.service.tsimport { Injectable } from '@angular/core';
import { LogService } from './log.service'; // увезимо

@Injectable()
export class DataService {
  private data: string[] = ['a', 'b', 'c'];
  
  constructor(private logService: LogService) { // инжектујемо
    
  }
  
  getData(): string[] {
    this.logService.write('подаци примљени'); // користимо
    return this.data;
  }
  
  addData(name: string){
    this.data.push(name);
    this.logService.write('нови елемент додат'); // користимо
  }
}

Ово, међутим, није довољно. Потребно је још да додамо нови сервис и у класу компоненте, иако се он тамо директно и не користи:

app/app.component.tsimport { Component } from '@angular/core';
import {DataService} from './data.service';
import {LogService} from './log.service'; // увезимо

@Component({
  ........
  providers: [DataService, LogService] // додајемо
})