Question

有几种方法可以从Angular2中的元素中获取样式：

假设您在组件或指令中：

1-使用nativeElement：

    let color = elementRef.nativeElement.style.color;

但是，建议不要这样做，因为如果您打算在将来使用像web worker这样的东西，则不希望直接访问nativeElement。

2-使用Ruler：

    this.domAdapter = new browser.BrowserDomAdapter();
    this.ruler      = new Ruler( this.domAdapter );
    this
        .ruler
        .measure( this.elementRef )
        .then( ( rect ) => {
           // Now we have access to height and width and left and top 
        } );

这很酷，但是统治者不会给我颜色或任何其他样式，基本上标尺只给出Rectangle（基本上是Element.getBoundingClientRect（））。

而且，我们不能将渲染器用于获取元素样式，它只提供设置样式的方法。

Answer 1

这是我给出的一个可能的答案，它可能不正确但是到目前为止我已经得到了：

可能的答案：

刚看了一下Ruler类并意识到它正在使用DomAdapter并且它传递了native元素来获取矩形。

   // This is native Angular2 source code : 
   var clntRect = this.domAdapter.getBoundingClientRect(el.nativeElement);

我认为这意味着如果我们想要获得样式，我们可以使用domAdapter，如：

   let color = this.domAdapter.getStyle( this.elementRef.nativeElement , 'color' )

正如我们所看到的，domAdapter正在提供getStyles方法，所以应该有希望!!

我将提供更加简洁的信息，因为我要去Google搜索和调查。

Angular2获取元素/组件样式的正确方法

1 个答案: