CLI/수동을 사용하여 Angular에서 서비스 생성

4767 단어 serviceangular

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() { }
    
    }
    



  • 구성 요소에서 서비스를 사용하려면 먼저 다음과 같이 생성자에 주입해야 합니다.

    비공개 예: 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 Service

    라이브 예:

    Stack Blitz

    좋은 웹페이지 즐겨찾기