Создайте службу с помощью CLI
ng generate service <service-name>
Структура
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class <service-name> {
constructor() { }
}
Создание службы вручную
Чтобы создать новый сервис вручную:
- Перейдите в каталог вашего проекта Angular.
- Создайте новый файл
<service-name>.service.ts
. - В верхней части файла добавьте следующий оператор импорта.
import { Injectable } from '@angular/core';
- Добавьте службу @Injectable()
@Injectable({
providedIn: 'root',
})
- Добавьте оператор
class
, включающий код компонента с конструктором.
export class <service-name> {
constructor() { }
}
-
Используя сервис в компоненте, сначала нужно сделать Inject в конструкторе следующим образом:
Добавить в конструктор параметр private ex :
heroService
типаHeroService
.
// example
constructor(private heroService: HeroService) {}
Next Import :
// example
import { HeroService } from '../hero.service';
- Нужно добавить в
<app.module.ts>
вот так :
// example
@Component({
/* . . . */
providers: [HeroService]
})
и импортировать в него.
// example
import { HeroService } from '../hero.service';
Ссылка
Сервис Angular
Живой пример :
Stack Blitz