不能訪問元素margin-left

Question

在下面的代碼片段中，我似乎無法訪問.circle的當前margin-left 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) 

Answer 1

性能

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

.circle { 
    margin: 40px 20px; 
} 

由於margin是不是 a樣式屬性，則不能從dom元素的style成員訪問它。

更多

得到計算風格，將樣式屬性和CSS考慮正確的方法是使用getComputedStyle。 Docs：https://developer.mozilla.org/en/docs/Web/API/Window/getComputedStyle