with markup like this
<div class="wrapper">
<div class="wrapper-inner">
{CONTENT}
</div>
</div>
You could watch the wrapper-inner height changes and set the height of the wrapper
scope.$watch(
function() {
return innerElement[0].offsetHeight;
},
function(value, oldValue) {
element.css('height', value+'px');
}, true);
Then with a css transition animate the change in height
.wrapper {
overflow: hidden;
transition: height ease .3s;
}
here is a plunker http://plnkr.co/edit/IiR228W9Z9JFkvdvhVZp