[[oktatas:web:angular|< Angular]] ====== Angular szolgáltatások ====== * **Szerző:** Sallai András * Copyright (c) Sallai András, 2021, 2022, 2023 * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]] * Web: https://szit.hu ===== Szolgáltatás ===== Szolgáltatás generálása: ng generate service valami Rövden: ng g s valami A szolgáltatásokat egy **shared** nevű könyvtárba szokás tenni: ng g service shared/valami ===== Ami létrejött ===== Az ''ng g service shared/valami'' utasítás hatására létrejön a következő: * src/app/shared/valami.service.ts * src/app/shared/valami.service.spec.ts


import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class ValamiService {

  constructor() { }
}

Létrejött tesztfájl:


import { TestBed } from '@angular/core/testing';

import { ValamiService } from './valami.service';

describe('ValamiService', () => {
  let service: ValamiService;

  beforeEach(() => {
    TestBed.configureTestingModule({});
    service = TestBed.inject(ValamiService);
  });

  it('should be created', () => {
    expect(service).toBeTruthy();
  });
});

===== Felhasználás komponensben ===== Szolgáltatás:


import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class ValamiService {
  fruits = [
    'alma', 
    'körte', 
    'barack',
    'szilva'
  ];

  constructor() { }

  getFruits() {
    return this.fruits;
  }
}


import { Component, OnInit } from '@angular/core';
import { FruitService } from '../shared/fruit.service';

@Component({
  selector: 'app-teker',
  templateUrl: './teker.component.html',
  styleUrls: ['./teker.component.scss']
})
export class TekerComponent implements OnInit {

  fruits !: string[];

  constructor(private fruit: FruitService) { }

  ngOnInit(): void {
    this.fruits = this.fruit.getFruits();
  }

}



    
        {{fruit}}