Angular services

Сервіси в Angular виконують певні специфічні завдання, наприклад, логуваня, отримання та обробку даних і т.д. На відміну від компонентів і директив сервіси не працюють з уявленнями, тобто не працюють з html розміткою. Вони виконують певне і досить вузьке завдання.

Стандартні завдання сервісів:

• Надавати дані додатку. Сервіс може сам зберігати дані в пам'яті, або для отримання даних може звертатися до сервера

• Сервіс може бути каналом взаємодії між окремими компонентами аплікації

• Сервіс може інкапсулювати бізнес-логіку, різні обчислювальні завдання. Також в сервіс часто виносять куски спільного коду, таким чином вирішують проблему повторення коду.

Створеня нового сервісу.

cmd

ng g service todo

todo.service.ts

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

@Injectable({
  providedIn: 'root',
})
export class TodoService {

  constructor() { }

}

Даний сервіс є автоматично підключений до AppModule, завдяки параметру provideIn: 'root'

Якщо нам потрібно самостійно підключити сервіс в модулю, то сервіси підключаються в providers

app.module.ts

// ...
@NgModule({
    // ...
    providers: [
        TodoService
    ]
})
export class AppModule { }

Після того як ми підключили сервіс в модулі ми можемо ним користуватися в сомпонентах цього модуля. В компоненті сервіс підключається наступним чином

app.component.ts

// ...
export class TodoComponent implements OnInit {
    constructor(
        private todoService: TodoService
    ) {}
    
    // ...
}

Завдання.

• Створити TodoService та використати його в todo компоненті.

  cmd

  ng g service core/services/todo/todo

• Перенести todoData з компонента todo-list в сервіс і вже користуючись сервісом отримати TodoData.