Angular2将类添加到body标签

Rachid O 发表于 Dev

拉希德（Rachid O）：

如何在不将主体作为应用选择器和使用主机绑定的情况下将类添加到主体标签？

我尝试使用渲染器，但它改变了整个身体

身体标签上的Angular 2.x绑定类

我正在开发一个大型angular2应用，更改根选择器会影响很多代码，我将不得不更改很多代码

我的用例是这样的：

当我打开模式组件（动态创建）时，我希望文档滚动条隐藏

DaniS：

我想发表评论。但是由于缺少声誉，我写了一个答案。我知道解决此问题的两种可能性。

注入全局文档。嗯，这可能不是最佳做法，因为我不知道nativescript等是否支持该做法。但这至少比使用纯JS更好。

构造函数（@Inject（DOCUMENT）私有文档：Document）{} 

ngOnInit（）{this.document.body.classList.add 
   （'test'）; 
}

好吧，也许更好。您可以注入渲染器或渲染器2（在NG4上），然后将类与渲染器一起添加。

导出类myModalComponent实现OnDestroy { 

  构造函数（私有渲染器：Renderer）{ 
    this.renderer.setElementClass（document.body，'modal-open'，true）; 
   } 

  ngOnDestroy（）{ 
    this.renderer.setElementClass（document.body，'modal-open'，false）; 
  }

编辑ANGULAR4：

从'@ angular / core'导入{Component，OnDestroy，Renderer2}; 

导出类myModalComponent实现OnDestroy { 

  构造函数（私有渲染器：Renderer2）{ 
    this.renderer.addClass（document.body，'modal-open'）; 
   } 

  ngOnDestroy（）{ 
    this.renderer.removeClass（document.body，'modal-open'）; 
  }

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。