私のパーシャルの1つで、私はこれを行います:
<!-- Lesson Details -->
<div class="panel" id="change_subject" ng-if="$state.includes('dashboard.create.lessons')" ng-animate="{enter: 'basic-animation-enter', leave: 'basic-animation-leave'}">
<div class="panel_header">
<div class="panel_title">
<h5>
Lesson Details
</h5>
</div>
</div>
</div>
$state.includes は angular-ui ルーターの例からそのまま出てきたものです。もちろん、角度のあるUIを使用しています。
ここに私の appState 関数があります:
state('dashboard.create.lessons.detail', {
// parent: 'lessons',
url: '/{lessonId}',
views: {
'details@dashboard.create': {
templateUrl: "/app/partials/create.detail.html",
controller: ['$scope', '$stateParams', 'curriculumHash', function(scope, stateParams, curriculumHash){
curriculumHash.sstHash().then(function() {
scope.selectedContent = findInList(scope.sstArray, stateParams.lessonId);
scope.original = angular.copy(scope.selectedContent);
});
}],
}
}
})
かなり普通。
新しい stateParam ごとにパーシャルがリロードされると、ng-if は新しい DOM 要素を (新しい Hash $$ で) 作成します。そして、「enter」アニメーションを呼び出すたびに問題ありません。しかし、破棄される DOM 要素は「leave」を呼び出していません。
私が何も悪いことをしていないのであれば、これを行うためのより良い方法、つまり、新しいパラメーターを使用してリロード時にビューをアニメーション化する方法を求めるべきです...
ありがとう!
========== UPDATE ========== ここに JSFiddle があります。上記のコードから多くを借りているわけではありませんが、私はかなり確信しています。http://jsfiddle.net/morgs32/xPxkX/1