滚动事件未触发 [英] Scroll event is not firing
问题描述
当用户向下滚动浏览器窗口时,我必须显示更多图像.我有为此创建了一个指令.但滚动事件没有被触发.
I have to display more images as the user scrolls down the browser window.I have created a directive for that.But scroll event is not getting fired.
app.directive('whenScrolled', function() {
return function(scope, elm, attr) {
var raw = elm[0];
elm.bind('scroll', function() {
if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
scope.$apply(attr.whenScrolled);
}
});
};
});
在 LoadMoreItems 中,我将两个新项目推入列表:
In LoadMoreItems, I am pushing two new items into the list:
function LoadMoreItems() {
$scope.temp = $scope.allItems[$scope.lastCount];
$scope.items.push({
Name: $scope.temp.Name,
Price: $scope.temp.Price,
StockStatus: $scope.temp.StockStatus,
Picture: $scope.temp.Picture
});
$scope.temp = $scope.allItems[$scope.lastCount + 1];
$scope.items.push({
Name: $scope.temp.Name,
Price: $scope.temp.Price,
StockStatus: $scope.temp.StockStatus,
Picture: $scope.temp.Picture
});
$scope.lastCount += $scope.count;
}
下面的函数带来了特定于该类别的所有项目.
The below function brings all the items specific to the category.
function getAllItemss(cat) {
itemsFactory.getSpecificItems(cat)
.success(function(_items) {
$scope.allItems = _items;
//$scope.items = [];
$scope.lastCount = 0;
LoadMoreItems();
})
.error(function(error) {
$scope.status = 'Unable to load items : ' + error.message;
});
}
HTML:
<div when-Scrolled="LoadMoreItems()"></div>
推荐答案
来自 scroll 文档:
scroll
事件在用户滚动到某个元素时发送到元素元素中的不同位置.它适用于 window
对象,但也适用于到带有 overflow
CSS 属性集的可滚动框架和元素到 scroll
(或 auto
当元素的显式高度或宽度小于比其内容的高度或宽度).
The
scroll
event is sent to an element when the user scrolls to a different place in the element. It applies towindow
objects, but also to scrollable frames and elements with theoverflow
CSS property set toscroll
(orauto
when the element's explicit height or width is less than the height or width of its contents).
因此,尝试在 div
上设置 scroll
css 属性,或将事件侦听器绑定到 $window 对象(例如 $($window).bind('scroll',listener)
)并根据到它.
So, try to set scroll
css property on your div
, or bind event listener to $window object(e.g. $($window).bind('scroll',listener)
) and do your calculation according to it.
这篇关于滚动事件未触发的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!