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,
	},
]