无限滚动代码无法使用 angularjs?
Infinite scroll code not working using angularjs?
这是我正在使用 angularJS 实现无限滚动的代码。但是代码不工作,也没有显示错误。这是我的代码:
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
</head>
<style>
li {
height: 120px;
border-bottom: 1px solid gray;
}
#fixed {
height: 400px;
overflow: auto;
}
</style>
<body ng-controller="myCtrl">
<div id="fixed" when-scrolled="loadMore()" >
<ul>
<li ng-repeat="i in items">{{i.id}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
myApp.controller('myCtrl', function($scope){
$scope.items = [];
var counter = 0;
$scope.loadMore = function() {
for (var i = 0; i < 5; i++) {
$scope.items.push({id: counter});
counter += 10;
}
};
$scope.loadMore();
}
angular.module('scroll', []).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);
}
});
};
});
</script>
</body>
</html>
我认为 ng-app 或 ng-controller 有问题。由于我是 angularjs 的新手,请帮助我。
提前致谢。
除了你有很多语法错误之外,我没有看到任何代码问题。 works以下内容更正后
错误的变量引用:
var app = angular.module('myApp', []);//'app' variable declared but later
//referenced as 'myApp'
app.controller('myCtrl', function($scope){
控制器功能缺失 );
最后
并且由于某种原因为指令声明了一个新模块,但未注入 myApp
。除非您有明确理解的充分理由,否则不要生成不必要的模块。得到你已经定义的那个
app.directive('whenScrolled', function() {
这是我正在使用 angularJS 实现无限滚动的代码。但是代码不工作,也没有显示错误。这是我的代码:
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
</head>
<style>
li {
height: 120px;
border-bottom: 1px solid gray;
}
#fixed {
height: 400px;
overflow: auto;
}
</style>
<body ng-controller="myCtrl">
<div id="fixed" when-scrolled="loadMore()" >
<ul>
<li ng-repeat="i in items">{{i.id}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
myApp.controller('myCtrl', function($scope){
$scope.items = [];
var counter = 0;
$scope.loadMore = function() {
for (var i = 0; i < 5; i++) {
$scope.items.push({id: counter});
counter += 10;
}
};
$scope.loadMore();
}
angular.module('scroll', []).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);
}
});
};
});
</script>
</body>
</html>
我认为 ng-app 或 ng-controller 有问题。由于我是 angularjs 的新手,请帮助我。
提前致谢。
除了你有很多语法错误之外,我没有看到任何代码问题。 works以下内容更正后
错误的变量引用:
var app = angular.module('myApp', []);//'app' variable declared but later
//referenced as 'myApp'
app.controller('myCtrl', function($scope){
控制器功能缺失 );
最后
并且由于某种原因为指令声明了一个新模块,但未注入 myApp
。除非您有明确理解的充分理由,否则不要生成不必要的模块。得到你已经定义的那个
app.directive('whenScrolled', function() {