Angular-да сервис құру

Сервистерді зерттеуді өз сервисімізді жасаудан бастайық. Ол үшін test/src/app бумасында data.service.ts файлын жасаймыз. Біздің сервис экранға кейбір деректерді шығаруға жауапты болсын.

Сервисіміз үшін клас жасайық:

export class DataService {
	
}

Енді бізге Injectable декораторы керек. Оны қолдану сервис класын компонент класына енгізуге мүмкіндік береді. Біз енгізу туралы келесі сабақта сөйлесеміз. Ал қазір қажетті декораторды импорттайық:

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

export class DataService {
	
}

Оны біздің класқа қолданайық:

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

@Injectable()
export class DataService {
	
}

Енді біздің класта кейбір деректер болуы үшін жасайық. Әдетте Angular қолданбаларында деректер серверден жүктеледі, бірақ біз оқу мақсаттарында массивті қолданамыз. Оны жеке сипатта жасайық:

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

Енді деректерді алу үшін әдіс жазайық:

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

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

Біздің сервис дайын. Келесі сабақта біз оны компонент класына қосамыз.

Өз сервисіңізді жасаңыз, ол объектілер массивін тауарлармен қайтарады:

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