在$routeChangeStart
我想申请of-h
课程并在$routeChangeSuccess
上我要删除of-h
课程或将其更改为of-v
课程。现在只应用of-h
类。
HTML
<div class="container-outer" ng-class="addClassOnRouteChange">
<div class="container" ng-view autoscroll="true" ng-class="fadeNgView">
<!-- Views will be rendered here -->
</div>
</div>
JS
angular.module('starter', ['ngRoute', 'ngAnimate', 'myApp.controllers'])
.run(['$window', '$location','$rootScope', function ($window, $location, $rootScope) {
$rootScope.fadeNgView = '';
$rootScope.$on('$routeChangeStart', function() {
//event button item list to move forward
$rootScope.next = function() {
console.log('start');
$rootScope.fadeNgView = 'fade-ng-view';
$rootScope.addClassOnRouteChange = 'of-h';
}
});
$rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
$rootScope.addClassOnRouteChange = 'of-v';
});
}]);
答案 0 :(得分:1)
试试这个:
$rootScope.$apply(function(){
$rootScope.addClassOnRouteChange = 'of-h';
});
答案 1 :(得分:0)
试试这个
$rootScope.$on('$routeChangeStart', function() {
//event button item list to move forward
$rootScope.addClassOnRouteChange = true;
$rootScope.next = function() {
console.log('start');
$rootScope.fadeNgView = 'fade-ng-view';
$rootScope.addClassOnRouteChange = true;
}
});
$rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
$rootScope.addClassOnRouteChange = false;
});
现在将ng-class
代码更改为
ng-class="{addClassOnRouteChange?'of-h':'of-v'}"