Angular တွင် ဝန်ဆောင်မှုတစ်ခုအား အခြားဝန်ဆောင်မှုတစ်ခုအတွင်း ထည့်သွင်းခြင်း

ကျွန်ုပ်တို့၏ ပရောဂျက်အတွက် လုပ်ဆောင်ရာတွင် ၎င်းတို့၏ လုပ်ဆောင်ချက်များကို ချဲ့ထွင်ရန် ဝန်ဆောင်မှုတစ်ခုအား အခြားဝန်ဆောင်မှုတစ်ခုထဲသို့ ထည့်သွင်းရန် လိုအပ်နိုင်သည်။ ဒေတာအသစ်များ ထည့်သွင်းသည့်အခါ console တွင် မက်ဆေ့ဂျ်များကို ပြသမည့် နောက်ထပ် ဝန်ဆောင်မှုတစ်ခု ဖန်တီးကြပါစို့။

ပထမဦးစွာ test/src/app ဖိုလ်ဒါအတွင်း ဖိုင် log.service.ts ကို ဖန်တီးပါ။ LogService class ကို export လုပ်ပြီး console တွင် မက်ဆေ့ဂျ်ပြသရန် write function ကို ရေးသားပါမည်။

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

@Injectable()
export class LogService {
	write(message: string) {
		console.log(message);
	}
}

ထို့နောက် ကျွန်ုပ်တို့၏ DataService ဝန်ဆောင်မှုထဲသို့ သွားပြီး ကျွန်ုပ်တို့၏ ဝန်ဆောင်မှုအသစ်ကို import လုပ်၊ inject လုပ်ပြီး အသုံးပြုပါမည်။

import { Injectable } from '@angular/core';
import { LogService } from './log.service'; // import လုပ်သည်

@Injectable()
export class DataService {
	private data: string[] = ['a', 'b', 'c'];
	
	constructor(private logService: LogService) { // inject လုပ်သည်
		
	}
	
	getData(): string[] {
		this.logService.write('data received'); // အသုံးပြုသည်
		return this.data;
	}
	
	addData(name: string){
		this.data.push(name);
		this.logService.write('new elem added'); // အသုံးပြုသည်
	}
}

သို့သော် ဤအရာသည် မလုံလောက်သေးပါ။ တိုက်ရိုက်အသုံးမပြုသော်လည်း Component class အတွင်း၌ ဝန်ဆောင်မှုအသစ်ကို ထည့်သွင်းရန် လိုအပ်ပါသည်။

import { Component } from '@angular/core';
import {DataService} from './data.service';
import {LogService} from './log.service'; // import လုပ်သည်

@Component({
	........
	providers: [DataService, LogService] // ထည့်သွင်းသည်
})