Valla Valla - 4 months ago 6
AngularJS Question

How to add a value in the style in my html page using AngularJS

I am getting value from the scope variable and I want to add 20px to this value and display it in html. The following is the code:

<div id="container">
<div id="kv_load" style="display:none" > </div>
<img class="mark" src="img/favicon.ico" id="test" ng-style="{'position': 'absolute','top': x + '300px'}">
</div>
</div>


the value x comes from my controller and it has value of 300. When I try that it should display the element 600px from top but the value does not get added and displays at 300300px. It is concatenating both values.

Could you let me know how I could resolve this issue.

Answer

You can try this:

<div id="container">
    <div id="kv_load" style="display:none" >
        <img class="mark" src="img/favicon.ico" id="test" 
            ng-style="{'position': 'absolute','top': (x + 300) + 'px'}">
    </div>
</div>
Comments