角度1.2应用基于类的动画

Question

我做了一个html布局作为过滤器，我的html看起来像这样

<div class="filter">
    <small>User</small>
    <em ng-bind="filter.name">All Users</em>
    <nav>
        <a class="selected" ng-click="filter={name: 'All Users', filter: ''}">All Users</a>
        <hr>
        <a ng-click="filter={name: 'Person1', filter: 'Person1'}">Person1</a>
        <a ng-click="filter={name: 'Person2', filter: 'Person2'}">Person2</a>
        <a ng-click="filter={name: 'Person3', filter: 'Person3'}">Person3</a>
    </nav>
</div>

现在我的方法是创建一个指令，当我按下过滤器时，它会在过滤器类附近添加一个活动类，并在应用活动类时使用CSS，我会显示

.filter nav {
    display: none;
}
.filter.active nav {
    display: block;
}

现在我的问题是，有什么方法可以使用角度1.2动画库动画显示/隐藏导航div？

先谢谢你，丹尼尔。

Answer 1

您可能想要查看ngAnimate文档隐藏/显示动画（以及其他）几乎是免费的。您只需要引用ngAnimate，注入$ animate并添加enter / leave css样式。