css - AngularJS ng-show 后，固定位置 div 不再固定在底部

Question

这是我的问题：我有一个 id 为“foo”的 div：

#foo {
    position:fixed !important;
    bottom:0 !important;
    left:0;
    ...
}

以及它的崩溃动画：（请不要链接我 bootstrap-ui ...）

#foo.ng-hide-add, #foo.ng-hide-remove {
    -webkit-transition:all linear 0.5s;
    -moz-transition:all linear 0.5s;
    -o-transition:all linear 0.5s;
    transition:all linear 0.5s;
    display:block!important;
}

#foo.ng-hide-add.ng-hide-add-active,
#foo.ng-hide-remove {
    height:0;
}

#foo.ng-hide-add,
#foo.ng-hide-remove.ng-hide-remove-active {
    height:170px;
}

最后一个指令：

<pp-foo collap="foo.collapsed"></pp-foo>

它绑定了一个名为 foo.collapsed 的布尔值

<div id="foo" ng-hide="collap">
...
</div>

动画完美呈现，但隐藏/显示后 div foo 不再固定在底部。它在页面的中间。

应该在角度控制器中将底部重置为 0 吗？

应该直接使用 angular.animation 来获得更多处理吗？

任何想法 ？