⚡ Ionic 커스텀 디렉티브 생성 방법

## 개요
디렉티브는 HTML 요소에 동적 행동을 추가하는 기능으로, Ionic 앱에서 UI 컴포넌트의 재사용 가능성을 높이는 핵심 요소입니다. Angular CLI를 활용해 페이지/컴포넌트 생성 시 자동으로 제공되는 기본 디렉티브 외에도 사용자 정의 디렉티브를 만들 수 있습니다.

## 주요 특징
- Angular CLI 기반 자동 생성 지원
- Ionic 컴포넌트와의 연동 가능
- HTML 태그 확장 및 동작 추가
- 라이프사이클 훅 활용 가능

## 사용법
1. Angular CLI로 디렉티브 생성: `ionic generate directive my-directive`
2. 디렉티브 파일에서 @Directive 어노테이션 적용
3. IonicModule을 import하여 Ionic 컴포넌트 사용
4. selector 속성을 통해 HTML 태그로 호출

## 주의사항
- Ionic 컴포넌트를 디렉티브에 통합할 때는 IonicModule을 반드시 import해야 함
- 라이프사이클 훅(ngAfterViewInit 등)에서 DOM 접근 시 주의 필요
- 디렉티브 내부에서 이벤트 바인딩 시 viewContainerRef 사용 권장

## 관련 문법
Angular @Directive 어노테이션, IonicModule, Ionic 컴포넌트 라이브러리

@Directive({
  selector: '[appCustomButton]'
})
export class CustomButtonDirective {
  constructor(private viewContainerRef: ViewContainerRef) {}

  @HostListener('click') onClick() {
    const btn = this.viewContainerRef.element.nativeElement;
    btn.style.backgroundColor = 'blue';
  }
}

<!-- HTML 사용 예 -->
<button appCustomButton>클릭</button>