Javascript 将数据从addEventListener函数添加到ng repeat不会'；t更新DOM

当我使用addEventListener函数向$scope中的数组添加数据时，新数据可以记录在控制台中，但ng repeat重复的DOM不会改变

angular.module('module', [])
.controller('controller', function ($scope) {
  $scope.init = function () {
    $scope.list = [1,2,3,4,5,6,7,8,9,10]
    document.addEventListener('scroll', function (e) {
      // the bottom of window
      var windowBottom = e.target.documentElement.scrollTop + e.target.documentElement.clientHeight
      // top of loading div
      var loadingTop = document.getElementById('loading').offsetTop
      if (windowBottom >= loadingTop) {
        $scope.list.push($scope.list.length + 1)
        console.log($scope.list)
      }
    })
  }

文件
{{i}
加载。。。

html，正文{
保证金：0；
填充：0；
身高：100%；
}
身体{
背景色：#eee；
}
#包装纸{
高度：计算（100%-1px）；
}
.卡片{
背景色：#fff；
高度：80px；
线高：80px；
文本对齐：居中；
边缘底部：15px；
}
.装货{
高度：80px；
背景色：#e6；
线高：80px；
文本对齐：居中；
}

我所期望的是，当我滚动到文档底部的loading div时，新数据将被推送到$scope数组中，DOM repeat by ng repeat将同时更改，但它不起作用

列表数据可以记录在console.log中，但DOM没有更改

angular.module('module', [])
.controller('controller', function ($scope) {
  $scope.init = function () {
    $scope.list = [1,2,3,4,5,6,7,8,9,10]
    document.addEventListener('scroll', function (e) {
      // the bottom of window
      var windowBottom = e.target.documentElement.scrollTop + e.target.documentElement.clientHeight
      // top of loading div
      var loadingTop = document.getElementById('loading').offsetTop
      if (windowBottom >= loadingTop) {
        $scope.list.push($scope.list.length + 1)
        console.log($scope.list)
      }
    })
  }

---

运行演示：

Hello Friend

$scope

在角代码中调用事件处理程序时不会更新。为此，必须在事件处理程序之后使用

$scope.apply

angular.module（'module'，[]）
.controller（'controller'，function（$scope）{
$scope.init=函数（）{
$scope.list=[1,2,3,4,5,6,7,8,9,10]
document.addEventListener（'scroll'，函数（e）{
// 窗口底部
var windowBottom=e.target.documentElement.scrollTop+e.target.documentElement.clientHeight
// 加载div顶部
var loadingTop=document.getElementById（'loading'）.offsetTop
如果（窗口底部>=加载顶部）{
//if（$scope.flag）{
$scope.list.push（$scope.list.length+1）
log（$scope.list）
// }
}
$scope.$apply（）
})
}
})

html，正文{
保证金：0；
填充：0；
身高：100%；
}
身体{
背景色：#eee；
}
#包装纸{
高度：计算（100%-1px）；
}
.卡片{
背景色：#fff；
高度：80px；
线高：80px；
文本对齐：居中；
边缘底部：15px；
}
.装货{
高度：80px；
背景色：#e6；
线高：80px；
文本对齐：居中；
}

文件
{{i}
加载中

请检查答案是否符合您的要求