媒体查询打印的Angular 4指令

Question

尝试制作一个使用打印媒体查询隐藏元素的指令。在纯CSS中，它看起来像这样：

@media print {
  .no-print {
  display: none;
}

如何在使用elementRef的指令中应用它，这是我到目前为止所拥有的：

constructor(el: ElementRef) {
    el.nativeElement.setAttribute('style',
    `@media print {
    display: none;
    }`
  );
}

Answer 1

它可能是这样的：

@Directive({
  selector: '[myDirective]',
})
export class MyDirective {

  @HostBinding('class')
  elementClass = 'custom-theme';

  constructor() {
  }
}