媒体查询打印的Angular 4指令

时间:2017-08-02 23:31:34

标签: css angular angular-directive

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

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

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

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

1 个答案:

答案 0 :(得分:0)

可能是这样的:

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

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

  constructor() {
  }
}