show hide animation in eckig mit css

Question

In eckigen möchte ich ein div zeigen/verstecken, ich habe es mit ng-if getan, aber ich möchte Animation Effekt beim Öffnen und Schließen von div. Und ich möchte CSS dafür verwenden. Jede Hilfe wäre großartig.

Answer 1

http://jsfiddle.net/87mwvq7p/1/

<button ng-click="toggle = !toggle">Toggle!</button> 

<div class="box on" ng-show="toggle" ng-animate="'box'">On</div> 
<div class="box off" ng-hide="toggle" ng-animate="'box'">Off</div> 

Haben Sie einen Blick auf die oben example..it Sie

Answer 2

helfen könnte, ich verstehe Ihre Frage. Hier ist die Lösung:

Der HTML-Code:

<div ng-controller="MyCtrl"> 
    <button ng-click="showDiv = !showDiv">test </button> 
    <div ng-class="{ 'vis': showDiv}" > 
    hello test 
    </div> 
</div> 

Die CSS:

.vis { 
    opacity:0; 
    transition:opacity 0.5s linear; 
} 

Der Controller:

var myApp = angular.module('myApp',[]); 

function MyCtrl($scope) { 

} 

Hoffe, es hilft !!