Angular'da Servis Oluşturma

Servisleri incelemeye kendi servisimizi oluşturarak başlayalım. Bunun için test/src/app klasöründe data.service.ts dosyasını oluşturalım. Servisimizin ekrana bazı verileri yazdırmaktan sorumlu olmasına izin verin.

Servisimiz için bir sınıf oluşturalım:

export class DataService {
	
}

Şimdi Injectable dekoratörüne ihtiyacımız var. Onun kullanımı, servis sınıfının bir bileşen sınıfına enjekte edilebilmesini sağlayacaktır. Enjeksiyonu bir sonraki derste konuşacağız. Şimdi gerekli dekoratörü içe aktaralım:

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

export class DataService {
	
}

Onu sınıfımıza uygulayalım:

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

@Injectable()
export class DataService {
	
}

Şimdi sınıfımızda bazı veriler olacak şekilde ayarlayalım. Genellikle Angular uygulamalarında sunucudan veri yüklemesi yapılır, ancak eğitim amaçlı biz bir dizi kullanacağız. Onu özel bir özellikte oluşturalım:

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

Şimdi verileri almak için bir metot yazalım:

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

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

Servisimiz hazır. Bir sonraki derste onu bileşen sınıfına bağlayacağız.

Nesneler dizisini döndüren kendi servisinizi oluşturun:

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