无法访问元素边距

时间:2017-04-18 05:47:18

标签: html css angular typescript

在以下代码段中,我似乎无法访问margin-left的当前.circle css属性。我创建了一个PLUNKr来展示这个。

我正在尝试访问此属性,因为我需要调整移动设备上需要left-margin的属性绑定计算。

这是我所拥有的细分:

<div class="circle"  [ngStyle]="{'width': calcCircleWidth()}"></div>

.circle {
    margin: 40px 20px;
}

private calcCircleWidth(): string {
    var html: HTMLElement = (<HTMLElement>document.querySelector('.circle:first-child'))
    ...
}

这是我记录var html: HTMLElement

的属性时的结果
html \\ <div class="circle" _ngcontent-iai-1="" style="width: 50%;">
html.style \\ CSS2Properties { width: "50%" } 
html.style.marginLeft \\ (nothing)

1 个答案:

答案 0 :(得分:0)

根据您的代码

<div class="circle"  [ngStyle]="{'width': calcCircleWidth()}"></div>

.circle {
    margin: 40px 20px;
}

由于margin NOT 是元素的样式属性,因此无法从dom元素的style成员访问它。

更多

获取计算样式并将style属性和CSS考虑在内的正确方法是使用getComputedStyle。文档:https://developer.mozilla.org/en/docs/Web/API/Window/getComputedStyle