angularjs : ngAnimate not working

Question

나는 angularjs를 처음 사용합니다. 나는 레일 (angularjs-rails) 젬을 사용하여 angularjs를 시도하고있다. ngAnimate를 사용하는 데 문제가 있습니다. 기능이 잘 작동합니다. 즉, 각도가 제대로 설치되어 있고 "addEntry"함수가 새 항목을 추가하지만 애니메이션이 작동하지 않습니다. 내가 여기서 무엇을 놓치고 있는지 잘 모르겠습니다. 여기

<div ng-controller="MainCtrl"> 
    <button ng-click="addEntry()"></button> 
    <div ng-repeat="entry in entries" ng-animate="'demo'"> 
    <a>{{entry.name}}</a> 
    </div> 
</div> 

CSS는 ngAnimate을 지원하는 것입니다 : 여기

app = angular.module("MyApp", ['ngAnimate']) 

@MainCtrl = ($scope) -> 
    $scope.entries = [{name: "Dummy1"}, {name: "Dummy2"}] 

    $scope.addEntry = -> 
    $scope.entries.push({name: "Dummy3"}) 

은 HTML 파일입니다

당신은 설치 클래스에서 0으로 페이드 애니메이션 설정 불투명도를 원하는 경우

.demo-enter { 
    -webkit-transition: all 1s linear; 
    transition: all 1s linear; 
    background: #000; 
} 

.demo-enter.demo-enter-active { 
    background: #ccc; 
} 

Answer 1

ng-animate 속성은 1.2에서 더 이상 사용되지 않으며 더 이상 사용되지 않습니다. 대신, 애니메이션은 이제 클래스 기반입니다.

당신은 당신의 NG-반복 animaiton를 입력하는 이름을 붙일 '데모'당신은 특별한 이름 지정 규칙을 다음과 같은 몇 가지 추가 클래스와 그것을 장식 할을 원하는 경우 :

.demo.ng-enter { 
    transition: all linear 500ms; 
    opacity: 0; 
} 

.demo.ng-enter-active { 
    opacity: 1; 
} 

그런 다음에 '데모'클래스를 넣어

<div ng-repeat="entry in entries" class="demo"> 

데모 : 너무 좋은 http://plnkr.co/edit/kNeXtl6TpGNvtQEpErwh?p=preview

NG 반복을 포함하는 요소 주제에 대한 욕구 : http://www.yearofmoo.com/2013/08/remastered-animation-in-angularjs-1-2.html

Answer 2

, 활성 상태에서 불투명도는 1로 설정됩니다.

.animate-enter { 
    -webkit-transition: 1s linear all; /* Chrome */ 
    transition: 1s linear all; 
    opacity: 0; 
} 

.animate-enter.animate-enter-active { 
    opacity: 1; 
}