Я пытаюсь манипулировать классом элемента в директиве. Директива представляет собой панель инструментов, и она должна добавить класс к 2 элементам после некоторого прокрутки.
Это моя html
структура:
<ag-toolbar class="ag-toolbar--sec"></ag-toolbar>
<div ui-view="app" autoscroll="false" id="appView"></div>
И это моя директива:
function agToolbar($window) {
return {
restrict: 'E',
link: function(scope, element, attrs) {
var elView;
setTimeout(function(){
elView = document.getElementById("appView");
}, 400);
angular.element($window).bind("scroll", function() {
if (this.pageYOffset >= 128) {
element.addClass('scroll');
elView.addClass('agMargin');
} else {
element.removeClass('scroll');
elView.removeClass('agMargin');
};
});
}
};
}
В консоли я все время получаю ошибку:
elView.addClass не является функцией
elView.removeClass не является функцией
Но element.addClass
работает нормально. Любые идеи почему?
addClass
принадлежит jqLite
(или jQuery
если доступно), см. https://docs.angularjs.org/api/ng/function/angular.element.
То есть вам нужно обернуть элемент DOM в элемент jqLite
/jQuery
:
elView = angular.element(document.getElementById("appView"));
setTimeout()
? Чего бы вы ни пытались достичь, это довольно опасно, например, если пользователь прокручиваетelView
доelView
как будет установленelView
.