ngClass in host property of component decorator does not work

Question

I created the following simple example component that adds some attributes and listener to the component DOM element using the host property of the @Component decorator. In my c

Answer 1

This works for me and it's pretty modular:

import { Component, HostBinding, Input } from '@angular/core'

type Directions = 'vertical' | 'horizontal'

/**
 * A hairline.
 */
@Component({
  selector: 'hairline',
  styleUrls: ['./hairline.component.scss'],
  template: '',
})
export class HairlineComponent {
  @Input() direction: Directions = 'horizontal'
  @Input() padding = false

  @HostBinding('class')
  get classes(): Record {
    return {
      [this.direction]: true,
      padding: this.padding,
    }
  }
}