Css Angular JS：检测页面内容何时完全呈现并可见

我的处境

我有一个大名单的人都有自己的个人资料图片和信息。所有项目都有一些CSS3样式/动画

即时通讯使用：

<li ng-repeat="person in people">

并将此指令放在正在加载我的人员列表的包装器div上。但是，只要我的JSON数据对象被填充，加载就会停止，这只需要大约100毫秒，但是页面的实际视觉呈现需要4-5秒

我也尝试过类似的解决方案，但在那里我得到了同样的结果

我需要什么

---

当我浏览我的页面（所有页面都有相同类型的列表）时，我需要一些信息来告诉我页面何时已完全加载，并且对用户可见，以便我知道何时隐藏加载指示器。

尝试添加此指令——神奇之处在于链接功能：

directives
  .directive('onFinishRender', function ($timeout) {
  return {
    restrict: 'A',
    link: function (scope, element, attr) {
      if (scope.$last === true) {
          scope.$evalAsync(attr.onFinishRender);
      }
    }
  }
});

添加加载器作为第一项：

<li ng-show="!isDoneLoading">
  <div class="loading">Loading...</div>
</li>

加载。。。

然后在您的li中添加以下内容：

  <li ng-repeat="..." on-finish-render="isDoneLoading = true;"> ... </li>

如果这曾经奏效，那么现在就不行了。作用域似乎没有$last属性…Will，我认为您必须特别使用ng repeat（如OP）使$last发挥作用，根据：

  <li ng-repeat="..." on-finish-render="isDoneLoading = true;"> ... </li>