Question

我有一个简单的模态，有一个下一个按钮。

在这个模态中，我首先在

中显示内容

<div ng-show="step1"></div>

点击下一个按钮，我在＆＃39; step2＆＃34;中显示不同的内容。这是相同的模式。

因此整体模态内容看起来像......

<div class="modal-body">

  <div ng-show="step1">
    This is step 1
  </div>

  <div ng-show="step2">
    This is step 2
  </div>

</div>
<div class="modal-footer">

  <button class="btn btn-primary" ng-click="next()" ng-show="step1">Next</button>
  <button class="btn btn-primary" ng-click="prev()" ng-show="step2">Previous</button>

</div>

当用户点击enxt按钮，即在切换到步骤2中的内容之前，我想实现一些过渡效果。应该发生某种动画。

此时我不知道从哪里开始..任何帮助将不胜感激。

Plnkr在这里： http://plnkr.co/edit/eWy6XA1U4GCWr1cK22hH

Answer 1

You need to add  ['ngAnimate'] dependency on your module then add class to your ng-show element with the help of that class you need to provide css:-

以下是plunker更新： - http://plnkr.co/edit/PkdUxImq69s910etTy5U?p=preview

在angularjs中实现模态内的过渡效果

1 个答案: