Поддержка jQuery-анимации в AngularJS?

Question

Вот мои коды с помощью «JQuery»:

$("#myElement").fadeIn("slow").delay(1000).fadeOut("fast", -> 
    $('a')[0].click() 
) 

Я FadeIn элемента, а затем FADEOUT его, когда FADEOUT завершен, я вызвал событие щелчка <a> ..

Я пытался добавить этот фрагмент кода в функции ($scope.myFadeFunc) в угловом контексте, когда я исполняю $scope.myFadeFunc, браузер выдает ошибку:

Error: [$parse:isecdom] Referencing DOM nodes in Angular expressions is disallowed! Expression:myFadeFunc

Однако/FADEOUT эффект FadeIn работает р retty хорошо .. Кажется, что это всего лишь предупреждение вместо ошибка. Мне было интересно, какой рекомендуемый способ сделать эту анимацию в чистом стиле AngularJS.

Есть ли у кого-нибудь идеи о том, как это сделать в AngularJS без jQuery?

Answer 1

Вы смотрели на угловой документации animation

С, что вы могли бы, вероятно, нанизывать некоторый комплекс css key frame animation. Просто выясните, как долго должна быть анимация, и соответственно отрегулируйте проценты ключевого кадра. Что касается $('a')[0].click() в конце, вам придется обрабатывать это отдельно

Answer 2

Лучший способ анимировать что-то в Angular - использовать ngAnimate directive plus these awesome css animations!

Эти анимации css являются старыми (с 2013 года), но работают без проблем с последней версией Angular.