Krijimi i një Shërbimi në Angular

Le të fillojmë studimin e shërbimeve duke krijuar të tonin. Për këtë, në dosjen test/src/app do të bëjmë skedarin data.service.ts. Le të përgjegjë shërbimi ynë për shfaqjen e disa të dhënave në ekran.

Le të krijojmë një klasë për shërbimin tonë:

export class DataService {
	
}

Tani na duhet dekoratori Injectable. Zbatimi i tij do të lejojë që klasa e shërbimit të mund të futet në klasën e komponentit. Për futjen do të flasim në mësimin e ardhshëm. Tani le të importojmë dekoratorin e nevojshëm:

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

export class DataService {
	
}

Le ta zbatojmë atë në klasën tonë:

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

@Injectable()
export class DataService {
	
}

Tani le të bëjmë që në klasën tonë të ketë disa të dhëna. Zakonisht në aplikacionet Angular të dhënat ngarkohen nga serveri, por ne për qëllime mësimore do të përdorim një varg. Le ta krijojmë atë në një pronë private:

export class DataService {
	private data: string[] = ['a', 'b', 'c'];
}

Le të shkruajmë tani një metodë për marrjen e të dhënave:

export class DataService {
	private data: string[] = ['a', 'b', 'c'];

	getData(): string[] {
		return this.data;
	}
}

Shërbimi ynë është gati. Në mësimin e ardhshëm ne do ta lidhim atë me klasën e komponentit.

Krijoni shërbimin tuaj, i cili do të kthejë një varg objektesh me produkte:

[
	{
		name: 'prod1',
		cost: 100,
	},
	{
		name: 'prod2',
		cost: 200,
	},
	{
		name: 'prod3',
		cost: 300,
	},
]