Как создать директиву в angular?

@olen.shanahan 

Для создания директивы в Angular нужно выполнить следующие шаги:

1. Создайте новый файл с расширением ".directive.ts" (например, myDirective.directive.ts), где будет храниться код вашей директивы.
2. Внутри этого файла определите класс, который будет представлять вашу директиву. Для этого класса используйте декоратор @Directive из пакета @angular/core.

Пример кода для создания простой директивы:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

import { Directive, ElementRef } from '@angular/core';

@Directive({
    selector: '[myDirective]'
})

export class MyDirective {
    constructor(private elementRef: ElementRef) {
        // В конструкторе принимаем ElementRef для доступа к элементу, к которому будет применяться директива
        this.elementRef.nativeElement.style.backgroundColor = 'yellow';
    }
}

1. Зарегистрируйте вашу директиву в модуле приложения. Для этого импортируйте класс директивы и добавьте его в секцию "declarations" в конфигурации NgModule.

Пример кода для регистрации директивы в модуле:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

import { NgModule } from '@angular/core';
import { MyDirective } from './myDirective.directive';

@NgModule({
    declarations: [
        MyDirective
    ],
    ...
})
export class AppModule { }

1. Используйте вашу директиву в HTML-шаблоне компонента или другой директивы с помощью атрибута "myDirective".

Пример использования директивы в компоненте:

1
2
3

<div myDirective>
    Этот текст будет иметь желтый фон.
</div>

Теперь ваша директива будет применена к выбранному элементу. Вы можете изменить код директивы в соответствии с вашими потребностями.