5
私の角型アプリケーションに1.6.5の角度を使用していて、非常に奇妙な動作が起こりました。ng-viewでng-classを更新していない
ngrouteが変更されているときは、現在のビューからアクティブなクラスを削除し、アニメーションを終了するのを待ってから、アクティブなクラスを新しいビューに追加する必要があります。
設定でアプリと経路を設定しました。
var app = angular.module('app', ['ngAnimate', 'ngRoute']);
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl:"home.html",
reloadOnSearch:false
})
.when('/about-us', {
templateUrl:"about.html",
reloadOnSearch:false
})
.when('/contact', {
templateUrl:"contact.html",
reloadOnSearch:false
})
.otherwise({
template : "<h1>None</h1><p>Nothing has been selected</p>"
});
});
私はビューの可視性を示すアニメーションタイミングとブール値を格納するサービスがあります。私は、単純なデバッグ機能と電流からアクティブクラスを削除するべきものonRouteChangeStart機能を有する一つのメインコントローラを有する
app.service('animationProperties', function() {
this.animationTimings = {
views: 1000
};
this.visibility = {
view : false
};
});
をビュー（ビューの可視性ブール偽にすることによって）：
app.controller('MainCtrl', function ($scope, $window, $location,
animationProperties) {
$scope.animationProperties = animationProperties;
$scope.$on('$routeChangeStart',function() {
animationProperties.visibility.view = false;
});
$scope.toggleActive = function(){
$scope.animationProperties.visibility.view = !$scope.animationProperties.visibility.view;
}
});
そして最後、ngAnimateが完了する休暇アニメーションを待ち、その後、（）（doneメソッドで）現在のビューを削除し、真の可視性のブールを行うことにより、再び新しいビューに入る：あなたがいることがわかります（ナビゲーションから）ページを最初に切り替えるとき
ここapp.animation('.view', function($timeout, animationProperties) {
return {
enter: function(element, done) {
$timeout(function() {
animationProperties.visibility.view = true;
$timeout(function() {
done();
}, animationProperties.animationTimings.views);//Wait to enter
},animationProperties.animationTimings.views); //Wait for leave function
},
leave: function(element, done) {
$timeout(function() {
done();
}, animationProperties.animationTimings.views);
}
}
});
ですすべて正常に動作しますが、ページに2回目に行くとビュークラスは更新されないため、アニメーションは再生されません。デバッグ中は、可視性ブール値が正しく更新されていることがはっきりと分かりますが、ビューを終了してもクラスは更新されません。
お手数をおかけします。