How to change dynamically an html attribute with angularjs

Question

There is a simple way to change dynamically an html attribute?
I hide a div with angular scope variable and a ng-hide, but the size of the div still there, how I can change the size of that div?

I tried with:
<div id="bodyContent" ng-hide="showContent" style="height:size"></div>

and

<div id="bodyContent" ng-hide="showContent" style="height:{{size}}"></div>

docs.angularjs.org/api/ng/directive/ngStyle

Claies
– Claies

2015-10-22 22:12:11 +00:00
Commented Oct 22, 2015 at 22:12 — Claies
– Claies, Commented Oct 22, 2015 at 22:12
what is the problem? a hidden element has no height

charlietfl
– charlietfl

2015-10-22 22:44:48 +00:00
Commented Oct 22, 2015 at 22:44 — charlietfl
– charlietfl, Commented Oct 22, 2015 at 22:44

pasine · Accepted Answer · 2015-10-22 22:15:46Z

1

You must use ng-style

<div id="bodyContent" ng-hide="showContent" ng-style="{'height':size}"></div>

DEMO

answered Oct 22, 2015 at 22:15

pasine

11.6k10 gold badges53 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

charlietfl Over a year ago

nothing saves you have to, works using style also plnkr.co/edit/ZmoWbhSIDj502Dqp3fhh?p=preview ..may not be practical but it does work

Collectives™ on Stack Overflow

How to change dynamically an html attribute with angularjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related