maxidebox@list.ru | +7 (929) 701 21 71
Директива атрибута

Директива атрибута

Создание директивы атрибута

Директива это класс с декоратором @Directive. В Angular5 есть несколько видов директив. Директивы атрибута позволяют изменять внешний вид и поведение элементов, компонентов или других директив. Рассмотрим директиву атрибута подробнее.

Создадим файл \app\basic-highlight\basic-highlight.directive.ts:

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

@Directive({
  selector: '[appBasicHighLight]'
})
export class BasicHighlightDirective implements OnInit {

  constructor(private elementRef: ElementRef) {
  }

  ngOnInit() {
    this.elementRef.nativeElement.style.backgroundColor = "green";
  }

}
	

Директиву нужно подключить в файле \app\app.module.ts:

	
//...
import { BasicHighlightDirective } from './basic-highlight/basic-highlight.directive';

@NgModule({
  declarations: [
    //...
    BasicHighlightDirective
  ],
  //...
})
	

Теперь директиву атрибута можно использовать в шаблонах:

	
<p appBasicHighLight>
  basic highlight style
</p>
	

Создание из командной строки

Процесс создания файлов директив можно автоматизировать с помощью команды ng generate directive #name#. Или сокращенного варианта ng g d #name#

Renderer2

Использование класса Renderer2 для манипуляций с DOM:

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

@Directive({
  selector: '[appBetterHilight]'
})
export class BetterHilightDirective implements OnInit {

  constructor(private elRef: ElementRef, private renderer: Renderer2) { }

  ngOnInit() {
    this.renderer.setStyle(this.elRef.nativeElement, 'color', 'red');
  }

}
	

Голосов: 27 | Просмотров: 114

Заявка на создание сайта / Продвижение сайта

Документы на создание сайта

Изучите наше коммерческое предложение, заполните БРИФ и отправьте его на почту maxidebox@list.ru. Изучив все пожелания из БРИФ-а, обратным ответом оповестим Вас по стоимости разработке, ответим на вопросы.

КП на создание сайта Коммерческое предложение на созданеи сайта
Мы берем на себя ответственность за все стадии работы и полностью избавляем клиентов от забот и необходимости вникать в тонкости.

Скачать БРИФ (акета) на создание сайта Скачать БРИФ (акета) на создание сайта
Зополните у БРИФ-а все необходимые поля. Сделайте краткое описание к каждому из пунктов анкеты, привидите примеры в соответсвующий пунктах - это позволит лучше понять Ваши ожидания и требования к сайту

Закажите сайт по телефону: +7 (929) 701 21 71