问用于类绑定的angular自定义指令

EN

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

@Directive({
  selector: '[highlight]'
})
export class HighlightDirective {

  @Input('highlight') isHighlighted = false;

  constructor() {}

  @HostBinding('class')
  get function () {
    return {
      'highlighted': this.isHighlighted,
      'bordered': this.isHighlighted
    }
  }
}

<course-card (courseSelected)="onCourseSelected($event)"
             [course]="course"
             [highlight]="highlight">

.highlighted{
    box-shadow: 2px 2px 2px red;
}

.bordered {
    border-top: 5px solid lightgreen;
}