Javascript AngularJS动画卡翻转

我正在尝试使用新的AngularJS方式在页面转换之间制作动画，并希望加入卡片翻转（如）

我只是有点不确定如何更新代码，使其与AngularJS一起用于页面转换

---

有什么想法吗？

我意识到这是很久以前的事了，但我只是在做这件事，而且不需要javascript。关键是ng类。这是一本书

关键是这条线

<div class="card" ng-class="{'flipped':isFlipped}" ng-click="isFlipped=!isFlipped"> 

当$scope.isFlipped为true时，它会将类“flipped”分配给卡。这里有一个小的NFL闪存卡游戏，我放在一起的乐趣。查看源代码（它不是非常漂亮），如果您正在做这样的事情，它应该会很有帮助

是另一种解决方案，通过html可以更清楚地了解正在发生的事情。具体来说，翻转机制是在angularjs中，而不是隐藏在css魔术中。对于不是css专家的人来说，也许更容易理解：

<div class="card" ng-click="isFlipped=!isFlipped">
    <div class="face front" ng-class="{'flipped':isFlipped}">
        Front
    </div> 
    <div class="face back" ng-class="{'flipped':!isFlipped}">
        Back
    </div> 
</div>

正面
返回

非常有用。谢谢，扎克。这太棒了。喜欢简单。这很好。。。但这在firefox中似乎不起作用。。如何让JSFIDLE示例在firefox上运行？唯一适合我的解决方案+1为简单起见。

<div class="card" ng-click="isFlipped=!isFlipped">
    <div class="face front" ng-class="{'flipped':isFlipped}">
        Front
    </div> 
    <div class="face back" ng-class="{'flipped':!isFlipped}">
        Back
    </div> 
</div>