Kątowe zanikanie i zanikanie - standardowy sposób bez CSS?

Question

Bardzo trudno jest zrobić animację w kanciastym, w porównaniu do jquery. Jest tak wiele wersji animacji kątowej fadein i fadeout, że znalazłem je z blogów/tutoriali/etc, niektóre z nich są na starszej wersji kątowej. Angular's wydaje się być bardzo niespójny, kiedy jego nowa wersja zastąpi stare. Nie widzę żadnego standardowego sposobu robienia tego. Dlatego nie wiem, od czego zacząć.

Po prostu przyciemnienie formularza lub dokumentu html po kliknięciu przycisku.

html,

<button ng-click="loadInclude" >Load Include Form</button> 
<div ng-include="'form.php'" ng-if="readyToLoadForm===true"></div> 

kątowe,

var app = angular.module("myapp", ['ngAnimate']); 

    app.controller("FormController",function($scope) { 

      $scope.readyToLoadForm = false; 
      $scope.loadInclude = function(e) { 
       $scope.readyToLoadForm = true; 
      }; 
     } 
    ); 

jakieś pomysły?

Answer 1

można użyć ng-show lub ng-hide w tym przypadku

<div ng-show="readyToLoadForm" class="animate-show animate-hide">TEST HERE</div> 

podczas korzystania angular-animate.js kątową wolę add i remove kilka klas do tej pozycji podczas pokazywania i ukrywania. w oparciu o te klasy możemy ustawić animację css do elementu.

tutaj jest prosty plunker

---

dla ng-include animacji

ng-leave.ng-leave-active.ng-enter-active klas dodać do elementu. jest trochę skrótu o klasach dodawanych podczas animowania. i że jest wzorzec z ngAnimate

Oto ng-enter demo Plunker

---

oto reference jak dla klasy przypisany do elementu, gdy elementy animacji angularjs