获取元素高度 - 角2 [英] Getting element height - Angular 2

问题描述

我很好奇，如果我能得到元素属性形成组件模板。
所以我做了简单的分度类，我做了这个类：

I was curious if I can get element properties form component template. So I have made simple div with class and I've made this class:

export class viewApp{

  elementView: any;
  viewHeight: number;
  myDOM: Object;

  constructor() {
    this.myDOM = new BrowserDomAdapter();
  }

  clickMe(){
    this.elementView = this.myDOM.query('div.view-main-screen');
    this.viewHeight = this.myDOM.getStyle(this.elementView, 'height');
  }
}

的getStyle（），查询（）来自的 BrowserDomAdapter 。
我的问题是，当我试图让高度是空，但是当我通过的setStyle（）设置一些高度和然后，我通过的getStyle得到它（）返回正确的值。
在浏览器的DOM检查和风格后，我发现，这是因为两个CSS元素。其一是： .view-主画面[_ngcontent-AER-1] {} 键，第二个是元素{} 。
.view-主屏幕有一些花式，但元素为空。当我通过的setStyle添加样式（）出现在元素{} 。这是为什么？我怎样才能用Angular2得到元素属性？

getStyle(), query() are from BrowserDomAdapter. My problem is when I try to get height it is null, but when I set some height by setStyle() and then I get it by getStyle() it returns proper value. After checking DOM and styles in browser I discovered that is because of two CSS elements. One is: .view-main-screen[_ngcontent-aer-1]{} and second one is element{}. .view-main-screen has some stylings, but element is empty. When I add styles by setStyle() it appears in element{}. Why is that? How can I get element properties by using Angular2?

推荐答案

据我所知标尺类应提供该功能
的https://github.com/angular/angular/blob/master/modules/angular2/src/platform/browser/ruler.ts如果这是不足够多，你可能需要访问 elementRef.nativeElement 并使用元素提供了直接访问DOM和功能。

As far as I know the Ruler class should provide that functionality https://github.com/angular/angular/blob/master/modules/angular2/src/platform/browser/ruler.ts if this isn't enought you probably need to access elementRef.nativeElement and use direct DOM access and functions provided by the elements.

new Ruler(DOM).measure(this.elRef).then((rect: any) => {
});

规则服务是WebWorker安全。
另请参见 https://github.com/angular/angular/issues/评论6515＃issuecomment-173353649

这篇关于获取元素高度 - 角2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！