ngAnimate와 ngClass 간의 충돌로 인해 DOM이 손상되는 것을 방지하려면 어떻게해야합니까?

Question

방금 ​​ngAnimate 라이브러리 (1.2.13)를 사용하기 시작했으며 ngClass와 함께 ngRepeat 지시문을 사용하면 DOM이 손상됩니다. ngClass가 ngAnimate 클래스로 정의되지 않은 기존 전환을 트리거하는 클래스를 추가하거나 제거 할 때 충돌이있는 것으로 보입니다.

다음과 같은 Plunker에서 동작을 복제했습니다. http://plnkr.co/edit/iw5st35cqp1GQeCxMhjj 요소 중 하나를 클릭하면 집중됩니다. 클래스 dm-focused이 ngClass가있는 요소에 추가되고 높이가 전환됩니다. 집중된 요소가 제거되면 목록에서 사라지지만 대신 결함이있어 초점이 맞춰진 상태로 고정됩니다.

내가 해결할 수있는 유일한 해결책은이 결함으로 고통받는 모든 기존 클래스에 대해 모든 ngAnimate 클래스를 transition: none으로 설정하는 것입니다. 그러나 ngClass와 ngAnimate에서 전환을 사용하려면 어떻게해야합니까? 또한 모든 응용 프로그램을 검토하고 불필요한 동작을 방지하기 위해 불필요한 스타일을 추가해야합니다.

Answer 1

애니메이션이 아닌 특정 동작에만 클래스를 사용하는 것이 가장 좋은 해결책이라고 생각하십시오. 어떤 경우

당신이 요소 JS에서

에 대한 애니메이션을 사용하지 않도록 설정할 수 있습니다 : HTML에서

app.directive('disableAnimate', ['$animate', function ($animate) { 
    return { 
     restrict: 'A', 
     link: function (scope, element) { 
      $animate.enabled(false, element); 
     } 
    }; 
} ]); 

:

<div disable-animate><!-- your structure --></div>