Angular 2
Directrices de atributos para afectar el valor de las propiedades en el nodo host mediante el decorador @HostBinding.

@HostBinding

El decorador @HostBinding nos permite programar un valor de propiedad en el elemento host de la directiva. Funciona de manera similar a un enlace de propiedad definido en una plantilla, excepto que se dirige específicamente al elemento host. El enlace se verifica para cada ciclo de detección de cambios, por lo que puede cambiar dinámicamente si se desea. Por ejemplo, digamos que queremos crear una directiva para los botones que agrega dinámicamente una clase cuando presionamos sobre ella. Eso podría parecer algo como:

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

@Directive({
  selector: '[appButtonPress]'
})
export class ButtonPressDirective {
  @HostBinding('attr.role') role = 'button';
  @HostBinding('class.pressed') isPressed: boolean;

  @HostListener('mousedown') hasPressed() {
    this.isPressed = true;
  }
  @HostListener('mouseup') hasReleased() {
    this.isPressed = false;
  }
}

Tenga en cuenta que para ambos casos de uso de @HostBinding estamos pasando un valor de cadena por el cual queremos afectar la propiedad. Si no suministramos una cadena al decorador, entonces se usará el nombre del miembro de la clase. En el primer @HostBinding, estamos configurando de forma estática el atributo de función para el botón. Para el segundo ejemplo, la clase presionada se aplicará cuando isPressed sea verdadero