无限滚动代码无法使用angularjs工作？

Question

这是我正在使用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的新手，请帮助我。

提前致谢。

Answer 1

除了您有很多语法错误的事实之外，我看不到代码有任何麻烦。 纠正以下内容后，它将起作用 。

错误的变量参考：

var app = angular.module('myApp', []);//'app' variable declared but later 
//referenced as 'myApp'
app.controller('myCtrl', function($scope){

控制器功能缺失); 到底

以及由于某种原因而声明为指令的新模块，并且未注入到myApp 。 除非您有明确的充分理由，否则不要生成不必要的模块。 获得与您已经定义的相同的对象

app.directive('whenScrolled', function() {