Question

我刚刚开始研究一个需要我学习AngularJS的项目。我要做的是创建两个滑入屏幕的菜单，一个从左边，一个从右边。当他们这样做时，他们推送内容。

目前我可以让一个或另一个工作，但不是两个。我意识到这是因为我正在定义ng-class的方式。我只是不能完全理解如何正确地做到这一点。

<div ng-class="{true:'slide-left', false:''}[toggleSlide]" class="container">

    <div class="content">
        <button ng-click="toggleSlide = !toggleSlide" class="btn-left">From Left</button>
        <button ng-click="toggleSlide = !toggleSlide" class="btn-right">From Right</button>
    </div>

    <div class="slide-from-left">
        <p>Here is information that slides from off screen left.</p>
    </div>

    <div class="slide-from-right">
        <p>Here is information that slides from off screen right.</p>
    </div>
</div>

Answer 1

根据需要设置这样的ng-class语法：

<div ng-class="{'slide-left':toggleSlide, 'slide-right':!toggleSlide}" class="container">

另外，我猜你试图让你的代码适应你看到的其他东西，所以我也会提供一些东西。这是ng-class使用ng-repeat的{{1}}来为偶数和奇数发布类：

$index

angularjs - 从多次ng-clicks中切换ng-class

1 个答案: