CODEWITHSUNDEEP
angularjs
prashanth
prashanth

Reputation: 85

Setting width dynamically angularjs

I want to set width dynamically. I have tried:

iElement.find("#mycontent").css({width:iElement.width()+ 'px !important'});

In html:

<div id="mycontent"></div>

I am trying above syntax to get width on the div's id "mycontent". When I alert IElement.width(), i have the exact value. But when i add the above code, width is not setting on element or anywhere. I dont understand, why it is not working.

Please help.

Upvotes: 1

Views: 4970

Answers (1)

Abhilash Augustine
Abhilash Augustine

Reputation: 4208

You can do it with angular model.

<div id="mycontent" style="width:{{myWidth}}px; height:400px; background-color:black"></div>

And now you can adjust the width by varying the model $scope.myWidth.

Or you can simply adjust it from the html page itself.

<input type="text" ng-model="myWidth" />

Edit

And also you can set ng-style directive to set width dynamically.

<div ng-style="myStyle" >

And now you can set your width in the model myStyle.

For example, you can set it's width on a button click,

<button ng-click="myStyle = {'width' : '100px'}"> Set a width </button>

Hope this will help you.

Please feel free to ask any doubts about this as comment.

Upvotes: 3

Related Questions