Программируемое изменение ngShow не использует классы ngAnimate

Я пытаюсь вызвать ngShow через мой контроллер, он работает, но он не использует классы ngAnimate, которые мне нужны, чтобы получить переход затухания.Программируемое изменение ngShow не использует классы ngAnimate

Он работает, как и должен, если я использую кнопку для переключения ngShow, но не в том случае, если я переключаю ее программно. Это ожидаемое поведение? Могу ли я обойти это?

Plunk: http://plnkr.co/edit/swJDP1KBBxcRfK9auYPs?p=preview

<body ng-controller="MainCtrl"> 
    <input type="checkbox" ng-model="visible"> 
    <div ng-show="visible" class="wrap" role="document"> 
     Hello 
    </div> 
    </body>

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

app.run(function($rootScope) { 
    $rootScope.visible = false; 
}); 

app.controller('MainCtrl', function($rootScope, $scope) { 
    $rootScope.visible = true; 
});

.wrap.ng-hide-add-active { 
    display: block!important; 
    transition: 0.5s ease-in-out all; 
} 

.wrap.ng-hide-remove-active { 
    display: block!important; 
    transition: 0.5s ease-in-out all; 
    transition-delay: 0.5s; 
} 

.wrap.ng-hide { 
    opacity: 0; 
}

источник

2015-06-23 INT

Вы запустить блок и коды контроллера вероятно получить выполнены в том же цикле переваривать так угловую Безразлично Нет visible изменение переменной. Это будет работать, если вы поместите свой код контроллера в таймаут. например

app.controller('MainCtrl', function($rootScope, $scope, $timeout) { 
    $timeout(function() { 
    $rootScope.visible = true; 
    }); 
});

http://plnkr.co/edit/5IhGE3ol5kI64OlT1e8v?p=preview

источник

2015-06-23 14:15:57 rob

Я заметил, что это работает с тайм-аут, а также. Тем не менее, он чувствует себя немного взломанным. Нет других решений этой проблемы? – INT

Не знаю, если. Я сделал быстрый поиск, но натолкнулся на тот же ответ: http://stackoverflow.com/a/20505571/373655 – rob

Программируемое изменение ngShow не использует классы ngAnimate

ответ

Смежные вопросы