В настоящее время я разрабатываю директиву слайдов для AngularJS. Javascript состоит из трех типов директив: директивы для каждого типа скользящего меню (для краткости я использовал только левое скользящее меню), одну директиву обертки для остальной части экрана, asmWrapper и одна управляющая кнопка, asmControl. В настоящее время все эти директивы используют службу asmService для связи.
Когда пользователь нажимает на asmControl, этот директивный контроллер вызывает метод asmService, который определяет, какое меню было запущено, и выдает "asmEvent" на $rootScope. Контроллер asmSlidingMenu поймает это событие и обновит активную переменную в своей области, но класс CSS класса DOM останется без изменений.
Я предполагаю, что ng-class не установлен. Как это исправить?
Я включил код для директивы asmSlidingMenu ниже. Чтобы увидеть более полный пример, просмотрите Plunker, который я сделал.
slideMenu.directive('asmSlideLeft', ['$rootScope', 'asmService',
function($rootScope, asmService) {
return {
restrict: 'AEC'
, scope: {}
, controller: function($scope) {
$rootScope.$on('asmEvent', function(event, prop) {
console.log('Intercepted: ' + asmService.asmStates.slideLeft.active);
$scope.active = asmService.asmStates.slideLeft.active;
});
}
, compile: function(element, attrs) {
attrs.$set('class', 'asm asm-horizontal asm-left');
attrs.$set('data-ng-class', '{"asm-left-open: active"}');
return {
pre: function preLink(scope, iElement, iAttrs) {}
, post: function postLink(scope, iElement, iAttrs) {}
}
}
}
}]);