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

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 
        } );

这很酷，但是尺子不会给我 color 或任何其他样式，基本上尺子只给了 Rectangle（基本上是 Element.getBoundingClientRect()）。

另外，我们不能使用Renderer来get元素样式，它只提供set样式的方法。

Answer 1

这是我给出的一个可能的答案，它可能不正确，但这是迄今为止我所得到的：

可能的答案：

刚刚查看了 Ruler 类并意识到它正在使用 DomAdapter 并且它通过原生元素来获取矩形。

   // 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 方法，所以希望是这样！！

我会在进行谷歌搜索和调查时提供更简洁的信息。